창 너비에 따라 컨트롤을 자르는 방법?

Question

부모 창의 크기를 기준으로 컨트롤의 너비와 내용의 크기를 조정하려고합니다. 예를 들어 :

창을보다 작은 크기 조정될

<Window 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
    <Grid> 
     <StackPanel Orientation="Horizontal"> 
      <Border Width="100" Background="Red" /> 
      <Border Width="100" Background="Green" /> 
      <Border Width="100" Background="Blue" /> 
     </StackPanel> 
    </Grid> 
</Window> 

내가 테두리에 원하는 폭 300 픽셀은 예를 들어,의와을 가지고 30. 어떻게 할 수 있습니까? 감사

Answer 1

당신은 당신의 Grid에 열을 생성하고 설정할 수 있습니다

MaxWidth 100 : 당신이 전체 Grid의 Width을 제한하려면

<Grid> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition MaxWidth="100"/> 
     <ColumnDefinition MaxWidth="100"/> 
     <ColumnDefinition MaxWidth="100"/> 
    </Grid.ColumnDefinitions> 
    <Border Grid.Column="0" Background="Red" /> 
    <Border Grid.Column="1" Background="Green" /> 
    <Border Grid.Column="2" Background="Blue" /> 
</Grid> 

또는 다음이 작동합니다 :

<Grid MaxWidth="300"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition/> 
     <ColumnDefinition/> 
     <ColumnDefinition/> 
    </Grid.ColumnDefinitions> 
    <Border Grid.Column="0" Background="Red" /> 
    <Border Grid.Column="1" Background="Green" /> 
    <Border Grid.Column="2" Background="Blue" /> 
</Grid> 

에서 이 경우 사용 가능한 공간 (최대 300)은 모든 열 사이에서 동등하게 나뉩니다.

더 복잡한 규칙에 대한 또 다른 해결책은 사용자 정의 IValueConverter 수 있습니다

편집 : XAML 다음

public class WidthConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     var width = (double)value; 
     if (width > 300) 
      return 100; 
     else 
      return 30; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     throw new NotImplementedException(); 
    } 
} 

과 : 귀하의 답변에 대한

<Grid> 
    <Grid.Resources> 
     <local:WidthConverter x:Key="WidthConverter"/> 
     <Style TargetType="{x:Type ColumnDefinition}"> 
      <Setter Property="Width" Value="{Binding ElementName=myWindow, Path=ActualWidth, Converter={StaticResource WidthConverter}}"/> 
     </Style> 
    </Grid.Resources>   
    <Grid.ColumnDefinitions> 
     <ColumnDefinition/> 
     <ColumnDefinition/> 
     <ColumnDefinition/> 
    </Grid.ColumnDefinitions> 
    <Border Grid.Column="0" Background="Red" /> 
    <Border Grid.Column="1" Background="Green" /> 
    <Border Grid.Column="2" Background="Blue" /> 
</Grid>