WPF Control positioning difficulties...

Question

Hi

I try to do something supposed to be extrely easy but it is now 3 hours that i can't...

I try to have 2 buttons "OK" and "Cancel" close to another but it does not work , whatever i do on the cancel button it makes it invisible, here is the code:

<Grid x:Name="LayoutRoot" Height="242">
 <Grid.ColumnDefinitions>
  <ColumnDefinition Width="0.723"/>
  <ColumnDefinition Width="0.128"/>
  <ColumnDefinition Width="0.149*"/>
     <ColumnDefinition Width="0.14"/>
    </Grid.ColumnDefinitions>
 <Grid.RowDefinitions>
  <RowDefinition Height="0.291*"/>
  <RowDefinition Height="0.12*"/>
  <RowDefinition Height="0.413*"/>
  <RowDefinition Height="0.176*"/>
 </Grid.RowDefinitions>
    <Label Grid.Row="0" Content="Please click the link next to get content." Background="{x:Null}" Foreground="#FFFFFFFF" Grid.Column="1" Margin="0,2,4,2" Grid.ColumnSpan="2"/>
    <TextBlock Grid.Row="1" Grid.ColumnSpan="3">
        <Hyperlink x:Name="hlLicense" Click="hlLicense_Click" TextDecorations="Underline" NavigateUri="Http://www.google.com" Foreground="#FFD24A4A">
            <Run Text="Http://www.google.com"/&gt;
        </Hyperlink>
    </TextBlock>
 <TextBox Text="" TextWrapping="Wrap"  AcceptsReturn="True" x:Name="tbLicense" VerticalScrollBarVisibility="Auto" Grid.Row="2" Grid.ColumnSpan="3"/>
    <TextBlock Foreground="Red"  Name="messageLabel" Grid.Column="0" Text="" TextWrapping="WrapWithOverflow" Grid.Row="3" Grid.ColumnSpan="3" />
    <Button Content="OK"  Grid.Row="3" Grid.Column="2" Width="87.083" Height="25.277" x:Name="btnActive"  Click="btnActive_Click"     />
    <Button Width="87.083" Content="Cancel" IsCancel="True" Grid.Column="3" d:LayoutOverrides="Width" Margin="0,0,0,0" HorizontalAlignment="Right" Grid.Row="3"  />

</Grid>

Thanks John

Answer 1

It has to do with your ColumnDefinition widths. When you take those out, it's drawn just fine. Your widths are too small, and the OK button's column's width is set to a * so it autosizes to fill the extra space.

this will show your cancel button fine because it's column will auto-adjust:

 <Grid.ColumnDefinitions>
  <ColumnDefinition Width="0.723"/>
  <ColumnDefinition Width="0.128"/>
  <ColumnDefinition Width="0.149*"/>
  <ColumnDefinition Width="0.14*"/>
 </Grid.ColumnDefinitions>

I don't know if that's exactly what you want, but you can work with it from there to do exactly what you need.