How to expand a control

Question

I've got a UserControl which has a grid, whose specification is as follows:

<Grid Name="fieldsGrid" Margin="15,0,0,10">
           <Grid.ColumnDefinitions>
               <ColumnDefinition Width="25"/>
               <ColumnDefinition Width="*"/>
               <ColumnDefinition Width="Auto"/>
               <ColumnDefinition Width="Auto"/>
               <ColumnDefinition Width="Auto"/>
           </Grid.ColumnDefinitions>
</Grid>

The second column is the one of interest. It displays a checkbox, whose text is contained in a TextBlock and appears as "Text..." if it is too long. This is accomplished through code-behind (I have my reasons) like so:

CheckBox currentCheckbox = new CheckBox();
TextBlock block = new TextBlock();
block.MaxWidth = 100;
block.Text = text;
block.TextWrapping = TextWrapping.NoWrap;
block.TextTrimming = TextTrimming.WordEllipsis;
currentCheckbox.Content = block;
currentCheckbox.ToolTip = metaText;
currentCheckbox.SetValue(Grid.RowProperty, rowNumber);
currentCheckbox.SetValue(Grid.ColumnProperty, 1);
currentCheckbox.Margin = new Thickness(0, 10, 10, 0);
currentCheckbox.VerticalAlignment = VerticalAlignment.Center;
fieldsGrid.Children.Add(currentCheckbox);

The problem is that I want to expand this checkbox as the UserControl is resized, thus showing more text as the size increases. How can this be accomplished?

Answer 1

Why don't you try this and thus remove code-behind?

<Grid Name="fieldsGrid"
      Margin="15,0,0,10">
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="25" />
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="Auto" />
    <ColumnDefinition Width="Auto" />
  </Grid.ColumnDefinitions>
  <CheckBox Grid.Column="1"
            Margin="0 10 10 0">
    <CheckBox.Content>
      <!--  Make a binding for the Text of TextBlock below  -->
      <TextBlock MaxWidth="{Binding ActualWidth,
                                    RelativeSource={RelativeSource FindAncestor,
                                                                   AncestorType={x:Type CheckBox}}}"
                 Text="Some Text LOng FFFFFFF DDDDDDDDDDDD"
                 TextTrimming="WordEllipsis"
                 TextWrapping="NoWrap" />
    </CheckBox.Content>
  </CheckBox>
</Grid>

That should give you the behavior your looking for and does everything your code-behind does(You need to sort the binding for text to the TextBlock ofc)

On OP's particular request (Code-Behind to be avoided if it can be):

Can add with the code-behind you got (at the end)

currentCheckbox.SizeChanged += (sender, args) => block.MaxWidth = args.NewSize.Width;  // Subtract the checkbox indicator width from args.NewSize.Width here for accurate TextBlock Width measurement

Video Link

Answer 2

This appeared to work for me. I used XAML just to define the CheckBox and the TextBlock containing it's label content, like this:

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="603.433" Width="730.97">
    <Grid Name="fieldsGrid"
      Margin="15,0,0,10">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="25" />
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Column="0" Text="Column 1"></TextBlock>
        <TextBlock Grid.Column="2" Text="Column 3, a bit bigger"></TextBlock>
        <TextBlock Grid.Column="3" Text="0" x:Name="txtWidth"></TextBlock>
        <TextBlock Grid.Column="4" Text="Column 5, really really really big"></TextBlock>
        <CheckBox Grid.Column="1" x:Name="testChk"
            Margin="0 10 10 0">
            <CheckBox.Content>
                <TextBlock x:Name="txtForCheckBox"></TextBlock>
            </CheckBox.Content>
        </CheckBox>
    </Grid>
</Window>

And then code-behind looks like this:

public MainWindow() {

    InitializeComponent();
    testChk.SizeChanged += testChk_SizeChanged;

    txtForCheckBox.Text = "Some text, test, test, test.";
    txtForCheckBox.TextTrimming = TextTrimming.WordEllipsis;
    txtForCheckBox.TextWrapping = TextWrapping.NoWrap;
}

void testChk_SizeChanged(object sender, SizeChangedEventArgs e)
{
    txtForCheckBox.MaxWidth = testChk.ActualWidth;
    txtWidth.Text = testChk.ActualWidth.ToString();
}

Hope that helps...