WPF and control auto size - wpf

is it possible that if i put a textbox in border container and will not specify height & width of textbox rather specify height & width for border and textbox will take the size of the border. how could i do this. i tried to do it in xaml but fail. need answer. thanks

http://msdn.microsoft.com/en-us/library/system.windows.horizontalalignment.stretch.aspx

It's nice and easy:
<Border Width="200" Height="70" BorderBrush="Black" BorderThickness="2">
<TextBox></TextBox>
</Border>

<Grid>
<Border Width="100" Height="100">
<TextBox />
</Border>
</Grid>
The text box will be of size of the border.

Related

Why is this WPF border is showing around the column and not the StackPanel?

I'm trying to place a Border around a StackPanel like so:
<Border CornerRadius="5" BorderBrush="#009999" Background="Transparent"
BorderThickness="2" Grid.Column="2" Grid.Row="0">
<StackPanel HorizontalAlignment="Center" Margin="0,30,0,0">
<!--Contents-->
</StackPanel>
</Border>
For some reason, the border is appearing around the column that the StackPanel is in, not the StackPanel itself. I can change the margin of the border, but that doesn't hold up if the screen is resized. I also tried getting rid of the StackPanel margin but that made no difference. The StackPanel is the only object in this column.
Border has default HorizontalAlignment equal to Stretch, so it takes full possible width.
Then StackPanel is centered inside the border because it has HorizontalAlignment="Center".
set HorizontalAlignment="Center" on Border. It will get width, equal to StackPanel width (plus Margin), and then will be centered
I think it is because you're setting the HorizontalAlignment to Center. Doing this will make the StackPanel size to whatever its content is.
If you move the Border to stackpanel your problems will be fixed :)
here it is:
<Grid>
<StackPanel Width="350" Height="200">
<Border BorderThickness="2" BorderBrush="Black" Width="350" Height="200">
<TextBlock>SomeText</TextBlock>
</Border>
</StackPanel>
</Grid>

Textbox stile like underlined

I would like to style my textboxes to display like just an underlined area.
Similar to image below...
How would I accomplish this?
Set on every textbox (or with a general style..):
BorderBrush="Black" BorderThickness="0,0,0,1" Background="Transparent"
Just put a border on the bottom
<TextBox BorderBrush="Black" BorderThickness="0,0,0,2"
HorizontalAlignment="Stretch" Height="40" />

Getting a Border Control to Have Sunken Border

I want my to have a sunken border like a textbox. How to do this? Is there a way to get the controltemplate to mimc the parent border?
There is no theme for you to use, but you can work around like this:
Using this MSDN model (http://i.msdn.microsoft.com/dynimg/IC84967.gif):
Here's my recommendation: (sunken inner)
Just change the height/width of the outside border and you use this block of XAML like a TextBox. Reverse the two border tags if you want an outder border instead. Should be easy for you.
<Border Width="100" Height="200"
BorderBrush="Gainsboro" BorderThickness="0,0,5,5">
<Border BorderBrush="Gray" BorderThickness="5,5,0,0">
<TextBox Text="Hello World"
BorderThickness="0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch" />
</Border>
</Border>
Special thanks to: Style a border with a different brush color for each corner
Should look like this:
You can try something like this
<Border Margin="20" BorderThickness="0.5" BorderBrush="Gray">
<Border BorderThickness="1,1,0,0" BorderBrush="DarkGray">
<ContentPresenter />
</Border>
</Border>
You might need to play with the colours though.

How to add a border to the Text inside a TextBlock in WPF?

I am kinda new to WPF, dont know if the question is weird. I wanted to know if its possible to add a border around the text inside a textBlock.
EDIT:
As per suggestion I have tried both but without much success:
<Border BorderBrush="#FF0B232F" BorderThickness="2">
<TextBlock HorizontalAlignment="Left" Text="TextBlock" TextWrapping="Wrap" FontSize="36" FontWeight="Bold" Foreground="#FF88BCCD" OpacityMask="Black"/>
</Border>
and
<Label BorderBrush="#FF0B232F" BorderThickness="2,2,2,2" Content="TextBlock" FontSize="36" FontWeight="Bold" Foreground="#FF88BCCD" />
Am I doing something wrong here?
In such cases I use Label or TextBlock placed in Border.
Both your approaches are correct, however, if you have the textblock/label inside a grid (or any other container) declared as you have, its contents will stretch.
Try setting the VerticalAlignment and/or HorizontalAlignment to an appropriate setting (Top/Left, Center)..
something like this:
<Border BorderBrush="#FF0B232F" BorderThickness="2" VerticalAlignment="Top">
<TextBlock HorizontalAlignment="Left" Text="TextBlock" TextWrapping="Wrap" FontSize="36" FontWeight="Bold" Foreground="#FF88BCCD" OpacityMask="Black"/>
</Border>
Assuming that you are asking for a full size TextBlock with a border overlay within the bounds of the TextBlock you could wrap it in a Grid and draw the borders over the top of the TextBlock like this...
<Grid HorizontalAlignment="Left">
<TextBlock Text="TextBlock" TextWrapping="Wrap" FontSize="36" FontWeight="Bold" Foreground="#FF88BCCD" OpacityMask="Black" />
<Border BorderBrush="#FF0B232F" BorderThickness="2" />
</Grid>
Because we haven't specified the grid row and column on the TextBlock and Border objects the border overlays on top of the TextBlock.
if you just want to have a border around your textblock or any other control use :
<Border>
<TextBlock></TextBlock>
</Border>
you set border properties like color ,cornerradius ,thickness,...

TextBox expanding with surrounding Grid but not with text

A window has a Grid with two columns. The left column contains a control with a constant width but with a height that adapts. The right column contains a TextBox that takes up all remaining space in the Grid (and thereby in the Window).
The Grid is given a minimal width and height and is wrapped within a ScrollViewer. If the user resizes the window to be smaller than the minimal width/height of the Grid, scrollbars are displayed.
This is exactly how I want it to be. However, a problem occurs when the user starts typing text. If the text is to long to fit in one line in the TextBox, I want the text to wrap. Therefore I set TextWrapping="Wrap" on the TextBox. But since the TextBox has an automatic width and is wrapped in a ScrollViewer (its actually the whole Grid that is wrapped), the TextBox just keeps expanding to the right.
I do want the TextBox to expand if the window is expanded, but I don't want the TextBox to expand by the text. Rather the text should wrap inside the available TextBox. If the text don't fit within the TextBox height, a scrollbar should be displayed within the TextBox.
Is there a way to accomplish this?
Below is some code that shows my problem:
<Window x:Class="AdaptingTextBoxes.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="300" Width="400" Background="DarkCyan">
<Grid Margin="10" Name="LayoutRoot">
<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
<Grid MinWidth="300" MinHeight="200">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button Grid.Column="0" Margin="0,0,10,0" Content="Button" Width="100" />
<TextBox Grid.Column="1" AcceptsReturn="True" TextWrapping="Wrap" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" />
</Grid>
</ScrollViewer>
</Grid>
</Window>
You could use an invisible border (its hacky but it works - its how I tend to sort out dynamic textbox sizes in Xaml):
<Border BorderThickness="0" x:Name="border" Grid.Column="1" Margin="0.5" />
<TextBox Grid.Column="1" AcceptsReturn="True" TextWrapping="Wrap" Width="{Binding ActualWidth, ElementName=border}" Height="{Binding ActualHeight, ElementName=border}" />
Have you tried setting the MaxWidth property on just the TextBox?
Edit after OP's comment
I would try getting rid of the ScrollViewer. The sizing used in the Grid's layout should take care of re-sizing and the scroll bar settings on the TextBox should take care of the rest.
The answer is based on Leom's answer.
The solution works great when you enlarge the window, but the resizing is not smooth when you make the window smaller. As the textbox participates in the grid's layout, it has to perform layout process multiple times. You can fix that by putting the texbox in the canvas, so the change of the size of the textbox no longer triggers the grid's re-layout.
The updated code:
<Border BorderThickness="0" x:Name="border" Grid.Column="1" Margin="0.5" />
<Canvas Grid.Column="1">
<TextBox AcceptsReturn="True" TextWrapping="Wrap" Width="{Binding ActualWidth, ElementName=border}" Height="{Binding ActualHeight, ElementName=border}" />
</Canvas>

Resources