2011-08-11 3 views
1

のC#、Vsualスタジオ2010のサイズを変更するWPF、Autoreziseリストボックス、ネット4ドット、WPF、マイクロソフトリボンC#、ウィンドウが

私は、ウィンドウの上部にあるリボンmenuesとWPFウィンドウと 下の領域を持っています私は私のコントロールでいっぱいにしようとしましたが、私は 私の窓でreziseするコントロールを得ることができません。

以下の例のリストボックスは、ウィンドウが表示され、ウィンドウの幅がユーザーのウィンドウのサイズを変更したときにその幅がウィンドウの幅に追従するように完全に「展開」されている必要があります私は窓の側にいる。

私はコントロールで遊んでみて、ウェブを検索しましたが、解決策を見つけるには できませんでした。 (一部のサイトは境界線の使用がトリックを行うことを意図していた)

画像image1は、「サーフェス」全体にまたがる背景画像です。 画像image2は小さなロゴ画像です。

<DockPanel DockPanel.Dock="Top"> 
    <Grid DockPanel.Dock="Top" Height="526" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="2" Name="BaseGrid"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="1" /> 
      <RowDefinition Height="60" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 
     <Image Grid.Column="0" Grid.Row="0" Grid.RowSpan="3" HorizontalAlignment="Left" Name="image1" VerticalAlignment="Top" Source="........./el_bg.jpg" Stretch="None" /> 
     <Grid Grid.Column="0" Grid.Row="1" VerticalAlignment="Top" Margin="2" HorizontalAlignment="Left"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="200" /> 
       <ColumnDefinition Width="100" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="50" /> 
      </Grid.RowDefinitions> 
      <Image Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Name="image2" Stretch="Fill" VerticalAlignment="Top" Source="........./shiny_rgb.png" /> 
      <ListBox Grid.Column="2" Grid.Row="0" Name="MessageToUser" VerticalAlignment="Top" /> 
     </Grid> 
    </Grid> 
</DockPanel> 

よろしく

+0

私はXamlからこのように見えるとは思っていません(どちらもKaxamlではうまくいきません)。背景画像、アイコン(左上?)、アイコンの右にあるListBoxのように見えます。そして残りのスペースはおそらくさらなるコンテンツのために残ります。そうですか? –

+0

'ListBox'が水平軸、垂直軸、またはその両方に利用可能なスペースをすべて取ると思っていますか? – XAMeLi

答えて

1

あなたが設定するべきではありませんLeftに水平アライメントを設定しています。これを試してください:

<DockPanel DockPanel.Dock="Top"> 
    <Grid DockPanel.Dock="Top" Height="526" VerticalAlignment="Top" Margin="2" Name="BaseGrid"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" /> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="1" /> 
      <RowDefinition Height="60" /> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 
     <Image Grid.Column="0" Grid.Row="0" Grid.RowSpan="3" HorizontalAlignment="Left" Name="image1" VerticalAlignment="Top" Source="........./el_bg.jpg" Stretch="None" /> 
     <Grid Grid.Column="0" Grid.Row="1" VerticalAlignment="Top" Margin="2"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="200" /> 
       <ColumnDefinition Width="100" /> 
       <ColumnDefinition Width="*" /> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="50" /> 
      </Grid.RowDefinitions> 
      <Image Grid.Column="0" Grid.Row="0" HorizontalAlignment="Left" Name="image2" Stretch="Fill" VerticalAlignment="Top" Source="........./shiny_rgb.png" /> 
      <ListBox Grid.Column="2" Grid.Row="0" Name="MessageToUser" VerticalAlignment="Top"> 
       <ListBoxItem>One</ListBoxItem> 
       <ListBoxItem>Two</ListBoxItem> 
      </ListBox> 
     </Grid> 
    </Grid> 
</DockPanel> 

さらに、リストボックスはグリッドを含む第3列にあります。あなたはそれが全体のウィンドウ全体にストレッチしたい場合、あなたはそれがすべての3つの列にまたがるようにする必要があります:

<ListBox Grid.ColumnSpan="3" Grid.Row="0" Name="MessageToUser" 
     VerticalAlignment="Top"> 

あなたはWPF layout上に読んでください - あなたが必要以上にここに道複数のプロパティを設定しています。一度それを理解すると、このことははるかに直感的になります。さらに、Snoopのようなツールを使用すると、レイアウトに何が問題なのかを把握するのに役立ちます。次のスタイルを適用する

0

は私がこの要件を満たす助け:

<Style x:Key="listBoxAutoFill" TargetType="ListBoxItem"> 
    <Setter Property="Template"> 
     <Setter.Value> 
     <ControlTemplate TargetType="{x:Type ListBoxItem}"> 
      <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" 
       BorderThickness="{TemplateBinding BorderThickness}" 
       Background="{TemplateBinding Background}" 
       Padding="{TemplateBinding Padding}" SnapsToDevicePixels="true"> 
       <ContentPresenter HorizontalAlignment="Stretch" 
        VerticalAlignment="Stretch" 
        SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" /> 
      </Border> 
      <ControlTemplate.Triggers> 
       <Trigger Property="IsSelected" Value="true"> 
        <Setter Property="Background" TargetName="Bd" 
        Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}"/> 
        <Setter Property="Foreground" 
        Value="{DynamicResource {x:Static SystemColors.HighlightTextBrushKey}}"/> 
       </Trigger> 
       <MultiTrigger> 
        <MultiTrigger.Conditions> 
        <Condition Property="IsSelected" Value="true"/> 
        <Condition Property="Selector.IsSelectionActive" Value="false"/> 
        </MultiTrigger.Conditions> 
        <Setter Property="Background" TargetName="Bd" 
        Value="{DynamicResource {x:Static SystemColors.ControlBrushKey}}"/> 
        <Setter Property="Foreground" 
        Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/> 
       </MultiTrigger> 
       <Trigger Property="IsEnabled" Value="false"> 
        <Setter Property="Foreground" 
        Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/> 
       </Trigger> 
      </ControlTemplate.Triggers> 
     </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

私の要件は、ウィンドウが/収縮育つが、同じ幅に適用できるよう、リストボックスの高さをリサイズについての詳細です。

<ListBox Grid.Row="1" Grid.Column="0" Width="158" 
    ItemContainerStyle="{StaticResource listBoxAutoFill}" 
    ItemsSource="{Binding ListBoxItems, Mode=TwoWay}" /> 
関連する問題