3

画像の水平方向のリストを表示するコントロールを wpf/xaml に作成しようとしています。固定するリストボックスの幅 (スクロールバーなし)。新しいアイテムが追加されると、既存のアイテムはそれに対応するために表示される画像の量を減らします (実際の画像は、表示される画像の量だけを減らすわけではありません)。この機能は、相対的な幅のプロパティ ("*") を持つグリッドに新しい列を追加するのと似ており、列には固定幅の画像が含まれています。これまでの私のコードは次のとおりです。

<Window.Resources>
    <ItemsPanelTemplate x:Key="ListBox_HorizontalItems">
        <StackPanel Orientation="Horizontal" />
    </ItemsPanelTemplate>

    <DataTemplate x:Key="ListBox_DataTemplate">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>
            <Image Width="150" Source="{Binding ImageSource}" />
        </Grid>
    </DataTemplate>

    <Style x:Key="ListBox_Style_Horizontal" TargetType="ListBox">
        <Setter Property="Width" Value="150" />-->
        <Setter Property="ItemTemplate" Value="{StaticResource ListBox_DataTemplate}" />
        <Setter Property="ItemsPanel" Value="{StaticResource ListBox_HorizontalItems}" />
    </Style>
</Window.Resources>

<Grid>
    <ListBox Name="lbxImages" Style="{StaticResource ListBox_Style_Horizontal}" Width="250"  Height="100" />
</Grid>

これは私が必要とするものに非常に近いです! ただし、新しいアイテムがリストに追加されたときに表示される画像の量を減らす方法がわかりません。現在、新しいアイテムが追加されるとスクロールバーが表示されます。私が自分自身をうまく説明していない場合に備えて、必要な機能を示すスクリーンショットをいくつか示します。

3 アイテム 4 アイテム 5 アイテム

これを達成する方法を誰かに教えてもらえますか? 助けてくれてありがとう!

4

2 に答える 2

9

次の UniformGrid を ItemsPanel として使用します。

<ItemsPanelTemplate>
    <UniformGrid Columns="{Binding Path=Items.Count,RelativeSource={RelativeSource AncestorType={x:Type ListBox}}}"/>
</ItemsPanelTemplate>

水平スクロールを無効にします。

<ListBox ScrollViewer.HorizontalScrollBarVisibility="Disabled">

アイテム テンプレートの変更:

<DataTemplate>
    <Image Source="{Binding ImageSource}"
           Stretch="None"
           HorizontalAlignment="Center"/>
</DataTemplate>
于 2012-04-16T10:58:51.420 に答える
0

ItemsPanelTemplate を置き換えるだけでは、スクロール バーを取り除くのに十分ではないことがわかりました。これは、ItemsPanelTemplate が ScrollViewer 内の ListBox 内のどこかに埋め込まれているためです。その ScrollViewer を削除する必要がある場合もあります。

ListBox のテンプレート全体を置き換えました。

<Style  TargetType="ListBox">        
    <Setter Property="Height" Value="Auto"/>
    <Setter Property="Width" Value="Auto"/>        
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate>
                <Border 
                    BorderBrush="Red" 
                    BorderThickness="1">
                    <UniformGrid  
                        IsItemsHost="True" 
                        Rows="1">                       
                    </UniformGrid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="ItemContainerStyle">
        <Setter.Value>
            <Style TargetType="ListBoxItem">                    
                <Setter Property="Width" Value="Auto"/>
                <Setter Property="VerticalAlignment" Value="Center"/>                    
                <Setter Property="VerticalContentAlignment" Value="Top"/>                    
                <Setter Property="Height" Value="25"/>
                <Setter Property="Padding" Value="5 0 5 0"/>
                <Setter Property="Background" Value="Transparent" />

                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="ListBoxItem">
                            <Border                                   
                                Background="{TemplateBinding Background}"
                                SnapsToDevicePixels="True">
                                 <!-- Presenter for the UniformGrid: -->
                                <ContentPresenter
                                    HorizontalAlignment="Center"
                                    VerticalAlignment="Center"/>
                            </Border>
                            <ControlTemplate.Triggers>
                        <!-- triggers to indicate selection -->

                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Setter.Value>
    </Setter>
</Style>

また、UniformGrid の列数を調べる必要もありません。システムは ListBoxItems の数だけを使用します。IsItemsHost="True" がそれをしてくれると思います。

于 2018-03-22T13:15:45.437 に答える