Remove Margin Button ContentDialog Windows 10 Mobile - XAML - c#

In my ContentDialog. On focus any element, type TextBox, the keyboard appear. When Keyboard appear, have a big margin above( so 20-30 px maybe). This space is the same height of the space allocated for Primary and Secondary Buttons. If have this margin, my content have a scrollbar and I do not want it. I have space sufficient to show all content of my dialog if remove this margin/padding of course.
This topic is related with: ContentDialog Windows 10 Mobile XAML - FullScreen - Padding
<StackPanel Orientation="Horizontal">
<TextBox x:Name="txtUser" IsSpellCheckEnabled="False"
Background="Black" Foreground="Red BorderBrush="Red" BorderThickness="1"
PlaceholderText="Digit your username"
GotFocus="txtUser_GotFocus" Style="{StaticResource TextBoxStyle}"
TextChanged="txtUser_TextChanged"
/>
<Button x:Name="MakeOff"
Height="32" BorderThickness="1"
HorizontalAlignment="Center"
Foreground="Red" Background="Black"
Style="{StaticResource ButtonStyle}"
Margin="0">
<HyperlinkButton
Height="32" BorderThickness="1"
HorizontalAlignment="Center"
Foreground="Red" Background="Black"
Margin="0"
NavigateUri="www.google.pt"
Style="{StaticResource HyperLinkButtonStyleMobile}"
Content="Register">
<HyperlinkButton.ContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" />
</DataTemplate>
</HyperlinkButton.ContentTemplate>
</HyperlinkButton>
<Button
Height="32" BorderThickness="1"
HorizontalAlignment="Center"
Foreground="Red" Background="Black"
Style="{StaticResource ButtonStyle}"
Margin="0">
<HyperlinkButton x:Name="btnRegisterTwo"
Height="32" BorderThickness="1"
HorizontalAlignment="Center"
Foreground="Red" Background="Black"
Margin="0"
NavigateUri="www.google.pt"
Style="{StaticResource HyperLinkButtonStyleMobile}"
Content="Register">
<HyperlinkButton.ContentTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" />
</DataTemplate>
</HyperlinkButton.ContentTemplate>
</HyperlinkButton>
<Button x:Name="MakeOffThree"
Height="32" BorderThickness="1"
HorizontalAlignment="Center"
Foreground="Red" Background="Black"
Style="{StaticResource ButtonStyle}"
Margin="0">
</StackPanel>
</Grid>
Someone help to remove this?
Thanks

Interestingly, the ContentScrollViewer inside the style is given a fixed height during run-time, and a hack is to remove this x:Name from the ScrollViewer.
<ScrollViewer HorizontalScrollBarVisibility="Disabled" VerticalScrollBarVisibility="Disabled" ZoomMode="Disabled" Margin="{ThemeResource ContentDialogContentScrollViewerMargin}" IsTabStop="False">
Also, you will need to add the RowDefinitions back to the root panel LayoutRoot in the style.
<Grid x:Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>

Related

Insert an inline image within a WPF TextBlock

I have below WPF TextBlock within a border:
<Border Visibility="{Binding Path=BlinkOn, Converter={StaticResource BoolToVis}}" BorderThickness="1" BorderBrush="Red" CornerRadius="5" Margin="5">
<TextBlock x:Name="lblStoryboard"
TextAlignment="Center"
Padding="5"
Width="Auto"
Background="Red"
Foreground="Black"
FontSize="12.5"
FontWeight="Bold"
Style="{StaticResource BlinkingTextBlock}"
Text="Hi there!"
TextWrapping="WrapWithOverflow"
Visibility="{Binding Path=BlinkOn, Converter={StaticResource BoolToVis}}">
</TextBlock>
</Border>
Now I am trying to insert an inline image in front of the Textblock text, I mean, to the left (left side) of the TextBlock text and in the same line. How can I do this?
Add Stackpanel with Horizontal Orientation.
I have removed the binding since it as nothing to do with Adding image.
<Border BorderThickness="1" BorderBrush="Red" CornerRadius="5" Margin="5">
<StackPanel Orientation="Horizontal" Margin="0,0,0,-1">
<Image Source="C:\Users\Administrator\source\repos\WpfApp4\WpfApp4\Koala.jpg" Margin="0,459,0,0" />
<TextBlock x:Name="lblStoryboard"
HorizontalAlignment="Center"
TextAlignment="Center"
Padding="5"
Width="Auto"
Background="Red"
Foreground="Black"
FontSize="12.5"
FontWeight="Bold"
Text="Hi there!"
TextWrapping="WrapWithOverflow" Margin="0,459,0,0"
/>
</StackPanel>
</Border>

how to vertically align a child item in centre of its parent height

I have a stack panel which has another stack panel and I would like the second panel to be at the centre of first stack panel.I changed orientation of these panels and vertical alignment nothing works..
Anybody worked on this ? I would like to have your help.
Update:
<StackPanel Grid.Row="0" Grid.RowSpan="4" Background="White" Visibility="Visible" Orientation="Vertical">
<StackPanel VerticalAlignment="Center" Grid.Row="0">
<ProgressBar Margin="0,15,0,0"
IsIndeterminate="True"
IsEnabled="True" Foreground="Black"/>
<TextBlock Visibility="Visible" Margin="6,6,6,15" Foreground="Black" FontSize="21" TextWrapping="WrapWholeWords" HorizontalAlignment="Center" Text="Loading..."/>
</StackPanel>
</StackPanel>
The problem here is the StackPanel. What stack panel does is that it stacks the items from one side (top, left...) so it's not possible to fully center an item in StackPanel. When items are stacked vertically, the VerticalAlignment property has no effect on items that are direct children of the panel. The same applies for HorizontalAlignment and horizonal stacking.
You should use Grid or Border to center items (I also removed the Visibility values since Visible is the default state):
<Grid Grid.Row="0"
Grid.RowSpan="4"
Background="White"
>
<StackPanel HorizontalAlignment="Center"
VerticalAlignment="Center"
Grid.Row="0"
>
<ProgressBar Margin="0,15,0,0"
IsIndeterminate="True"
IsEnabled="True"
Foreground="Black"
/>
<TextBlock Margin="6,6,6,15"
Foreground="Black"
FontSize="21"
TextWrapping="WrapWholeWords"
HorizontalAlignment="Center"
Text="Loading..."
/>
</StackPanel>
</Grid>
Try this... You have to set Orientation to Horizontal of parent StackPanel.
<StackPanel Grid.Row="0" Grid.RowSpan="4" Background="White" Visibility="Visible" Orientation="Horizontal">
<StackPanel VerticalAlignment="Center" Grid.Row="0">
<ProgressBar Margin="0,15,0,0"
IsIndeterminate="True"
IsEnabled="True" Foreground="Black"/>
<TextBlock Visibility="Visible" Margin="6,6,6,15" Foreground="Black" FontSize="21" TextWrapping="WrapWholeWords" HorizontalAlignment="Center" Text="Loading..."/>
</StackPanel>
</StackPanel>

Autosizing controls in XAML to fit a stack panel / dock panel, where the middle control is what needs to fill the space

How can I create this...
command http://img841.imageshack.us/img841/2631/46lc.jpg
in WPF.
I've read alot of other questions on using stack panel vs dock panel but can't seem to recreate what I want. This is what I currently have..
command2 http://img13.imageshack.us/img13/5374/7oft.jpg
and my xaml..
<DockPanel VerticalAlignment="Stretch" HorizontalAlignment="Stretch" Background="DarkGray" Grid.ColumnSpan="2" Grid.Row="1" LastChildFill="False" >
<TextBlock Text="{StaticResource commandText}" Style="{StaticResource Heading2}" Margin="0,0,0,0" VerticalAlignment="Center" DockPanel.Dock="Left" />
<TextBox Name="inputTextBox" VerticalAlignment="Center" HorizontalAlignment="Stretch" />
<Button x:Name="termSend" Content="{StaticResource sendText}" Margin="0,0,0,8" DockPanel.Dock="Right" VerticalAlignment="Center" />
</DockPanel>
<DockPanel>
<TextBlock VerticalAlignment="Center" Text="Command" DockPanel.Dock="Left"/>
<Button Content="Send" VerticalAlignment="Center" DockPanel.Dock="Right"/>
<TextBox VerticalAlignment="Center" Margin="5"/>
</DockPanel>

WPF TextBlock inside a Scrollviewer cuts off some text

So I have this problem, a textblock's text gets cut off, even though you can still scroll with scrollviewer to the end.
You can see the scrollviewer is still able to scroll to where the text should be.
Heres the XAML:
<Grid>
<ScrollViewer Height="Auto" VerticalScrollBarVisibility="Auto" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" >
<TextBlock x:Name="text" Padding="5" Margin="0" TextWrapping="Wrap" Text="" FontSize="24" TextTrimming="WordEllipsis" VerticalAlignment="Bottom" />
</ScrollViewer>
</Grid>
EDIT the whole pivot control code:
<controls:Pivot x:Name="pivot" Margin="0" Grid.Row="1" Title="title" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch">
<controls:PivotItem Header="Straipsnis">
<Grid>
<ScrollViewer Height="Auto" VerticalScrollBarVisibility="Auto" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" >
<Border BorderBrush="White" BorderThickness="1">
<TextBlock x:Name="text" Padding="5" TextWrapping="Wrap" Text="" FontSize="24"/>
</Border>
</ScrollViewer>
</Grid>
</controls:PivotItem>
<controls:PivotItem Header="Komentarai">
<Grid>
<ListBox x:Name="commentsListBox" ItemTemplate="{StaticResource CommentsList}" Height="Auto" Width="Auto" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" HorizontalAlignment="Stretch" FontSize="20"/>
<TextBlock x:Name="errorText" TextWrapping="Wrap" Text="Nėra komentarų..." FontSize="36" HorizontalAlignment="Left" Margin="10,0,0,0"/>
</Grid>
</controls:PivotItem>
</controls:Pivot>
Well, turns out the TextBlock has limits, 2048x2048 or something like that, after which the text just gets cut off.
So, I found this custom text control that bypasses this limitation :) Maybe someone will find it useful, I did.
Creating Scrollable TextBlock for WP7.
Download link

WPF Expander won't expand left when inside Canvas

I have a grid with 4 columns. In the first column is a Canvas with a ZIndex of 99 and inside that is an expander. The expand direction is set to RIGHT. When I click on the header, the expander expands OVER TOP of column 2...which is exactly what I want. I'm trying to replicate this (only the opposite direction) inside column 4, so that when expanded, it will show over column 3. Even though I've marked the ExpandDirection of the second expander to "Left", it still expands to the right, and off the screen.
Here is the working expander:
<Canvas Grid.Column="0" Panel.ZIndex="99" Grid.RowSpan="4" VerticalAlignment="Stretch" Margin="0,5">
<Expander ExpandDirection="Right" Style="{DynamicResource OptionsExpanderStyle}" VerticalAlignment="Stretch" Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type Canvas}}}">
<Border BorderBrush="Black" BorderThickness="0,0,2,0">
<Grid Background="White">
</Grid>
</Border>
</Expander>
</Canvas>
Here is the broken expander:
<Canvas x:Name="rightCanvas" Panel.ZIndex="99" Grid.RowSpan="4" Grid.Column="3" Margin="0,5">
<Expander ExpandDirection="Left" Style="{DynamicResource OptionsExpanderStyle}" HorizontalAlignment="Right" VerticalAlignment="Stretch" Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type Canvas}}}">
<Border BorderBrush="Black" BorderThickness="2,0,0,0">
<Grid Background="White" Width="150">
</Grid>
</Border>
</Expander>
</Canvas>
Do not use canvas.
Try something like that:
<Grid>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<TextBlock Background="LightBlue"
TextAlignment="Center" Text="Left Column"/>
<TextBlock Grid.Column="1" Background="LightCoral"
TextAlignment="Center" Text="Right Column"/>
</Grid>
<Expander Background="LightGray" ExpandDirection="Right"
Header="LeftMenu" VerticalAlignment="Top" HorizontalAlignment="Left">
<StackPanel Width="200">
<TextBlock Text="Some menu stuff"/>
<TextBlock Text="Some more"/>
</StackPanel>
</Expander>
<Expander Background="LightGray" ExpandDirection="Left"
Header="RightMenu" VerticalAlignment="Top" HorizontalAlignment="Right">
<StackPanel Width="200" >
<TextBlock Text="Some menu stuff"/>
<TextBlock Text="Some more"/>
</StackPanel>
</Expander>
</Grid>

Categories