WPF/Silverlight XAML Stretch Text Size to Fit container? - wpf

I've just started to play with WPF.
Is it possible to have the size of the text of a Label or TextBlock size itself to fill it's parent container?
Thanks,
Mark

You can use a ViewBox to visually zoom something to fit within its container. The other solutions here work, but they only stretch the control, not its content. The ViewBox will stretch both.
<!-- Big grid, will stretch its children to fill itself -->
<Grid Width="1000" Height="1000">
<!-- The button is stretched, but its text remains teeny tiny -->
<Button>
<!-- The viewbox will stretch its content
to fit the final size of the button -->
<Viewbox
Margin="4"
VerticalAlignment="Stretch"
Height="Auto">
<!-- The textblock and its contents are
stretched to fill its parent -->
<TextBlock
Text="Bartenders" />
</Viewbox>
</Button>
</Grid>

Depends on the parent container
Grid, DockPanel will stretch your control
StackPanel, WrapPanel will leave it to the control to size itself..

Set HorizonalAlignment/VerticalAlignment to "stretch".

Use DockPanel as parent container
<DockPanel>
<TextBlock />
</DockPanel>

Related

WPF UserControl fill ContentControl with fixed width and height

I have UserControls that I want to display in a ContentControl. So what I did(this is just one UserControl I have more):
<UserControl.Resources>
<DataTemplate x:Key="Suburb" DataType="{x:Type local:ViewSuburb}">
<local:ViewSuburb Width="Auto" Height="Auto" />
</DataTemplate>
</UserControl.Resources>
<ContentControl Grid.Column="1" Grid.Row="1" ContentTemplate="{StaticResource Suburb}">
</ContentControl>
(The ViewSuburb Width="Auto" Height="Auto" has no effect)
My problem is that the ViewSuburb is only used as a popup dialog thus in its .xaml I gave it a fixed width and height. If I set the width and height to auto then it is fine in the ContentControl and stretches accordingly but it stretches the popup over the screen. Since I gave it the fixed width and height the popup is fine but in the ContentControl it also has the fixed width and height.
Is there a way I can override the width and height of the SuburbView or if I set it to auto that the popup wouldn't stretch across the screen?
Thanks.
You should set the Width/Height of the Popup/Window that is the parent of the ContentControl.

Why doesn't my StackPanel's background color stretch to fill the full width?

I have a StackPanel with a background brush, and it contains a single button. It is contained within a Grid that is wider than the button.
Frustratingly, the background is only as wide as the button. I can see it around the button's margin. So I end up having this wide bar of default-gray next to my button which has a border of my background color around it.
<StackPanel Visibility="Visible" HorizontalAlignment="Right" Background="{StaticResource qtyBg}">
<Button x:Name="bttnQtyEditKeys" Content="EDIT KEYPAD" Visibility="Visible" Click="bttnQtyEditKeys_Click"/>
</StackPanel>
I was able to fix it by wrapping a Border around it, and setting the Border's background brush.
It's a hack, so it it annoys me. Is there an alternate way to make the StackPanel's background not be stupid?
The problem isn't your background, it's your StackPanel. Your background is fine, it's your StackPanel that isn't filling the available space.
You need to set HorizontalAlignment and VerticalAlignment to Stretch on your StackPanel.
This works fine for me:
<Grid>
<StackPanel Visibility="Visible" HorizontalAlignment="Stretch" Background="blue">
<Button x:Name="bttnQtyEditKeys" HorizontalAlignment="Right" Content="EDIT KEYPAD" Visibility="Visible" Click="bttnQtyEditKeys_Click"/>
</StackPanel>
</Grid>

How to set textblock or label with resizable font size in WPF?

In WPF, if i put any controls in grid, if i resize the grid, it automatically resizes all the controls in it.But in label or textblock or any other text elements, all the control sizes will change but font size remains same, it will not change.
If font has to change as per grid size, What should be done?
You can achieve this by using a ViewBox. It will transform (not resize) your font (well, the control) depending on the control size.
Look at this here for more information;
<Viewbox Stretch="Uniform">
<TextBlock Text="Test" />
</Viewbox>
The following lines also give the expected result.
<Viewbox>
<TextBlock TextWrapping="Wrap" Text="Some Text" />
</Viewbox>

WPF: Trigger a content resize with GridSplitter

I'm trying to force a grid/expander to reevaluate whether it needs a scrollbar, as it's showing emptiness.
I'm using this layout:
<Grid>
<toolstrip /> <!-- fixed height row -->
<Scrollviewer> <!-- * height -->
<Grid> <!-- all rows are 'Auto' height -->
<Expander />
<Expander> <!-- this one stretches far too high -->
<WPF Toolkit: DataGrid />
<Expander>
<GridSplitter/>
<Expander />
<Grid>
</Scrollviewer>
<stackpanel /> <!-- fixed height row -->
<Grid>
The DataGrid (WPF Toolkit) is bound to a property when the Window is initialized. Through some investigating, I've realized that when the window is initialized, the columns in the GridView start at about 10 pixels wide, then the content is added, then they're resized based on the sizes in the XAML (All using star widths - eg: 2*). This causes the grid to resize to about 6 times the height it needs to be as the window is showing, then it doesn't spring back and the only way to see what's at the bottom of the window is to either scroll or move the GridSplitter back up to where it should be and resize the Window. I haven't set the VerticalAlignment properties on anything.
So far I've tried all of the following called InvalidateArrange(), InvalidateVisual();, InvalidateMeasure() and UpdateLayout() on the problem expander and InvalidateArrange(), InvalidateScrollInfo(), InvalidateVisual() and UpdateLayout() on the Grid above it but it won't shrink back.
Is there any way I can force it to short of forcing the width of the columns in the DataGrid?
Try setting these properties on the ScrollViewer:
<ScrollViewer CanContentScroll="True"
VerticalScrollBarVisibility="Auto"
HorizontalScrollBarVisibility="Auto">
... content ...
</ScrollViewer>
If that doesn't work, can you provide a more exact representation of your XAML. Also, taking a look at the ScrollViewer in depth may help.

Perfect Center on WPF Canvas

Since the canvas requires a Top/Left for placement, if you want to center something, is adding a grid at the proper Canvas.Top with HorizontalAlignment="Center" the best way to do it, or is there a better way?
This snip is a 150X300 canvas, with some content centered in a grid ....
<Canvas Width="150" Height="300">
<Grid Canvas.Top="75" Width="106" HorizontalAlignment="Center">
{whatever you want centered}
</Grid>
</Canvas>
Guy's solution works, but you may have to tweak z-order and visibility if you're juggling hit testing.
Another alternative is having the Grid inside the Canvas (as you've specified in your XAML) with the Height/Width set to (or bound to) the Height/Width of the Canvas. Then setting HorizontalAlignment/VerticalAlignment to Center for the contents of your Grid.
I'm not sure if this will meet your exact requirement, but if you put both the canvas and the content inside a grid as peers, it will get you a centered result:
<Grid>
<Canvas Width="150" Height="300"/>
<Button HorizontalAlignment="Center" VerticalAlignment="Center" Width="106" Content="Click"/>
</Grid>

Resources