web-dev-qa-db-ja.com

ListBox ItemTemplateを取得してListBoxの幅全体を水平方向に引き伸ばす方法は？

ListItemをオレンジ色の背景でListboxの全幅に拡張したいです。

現在、それらはFirstName + LastNameと同じ幅です。

可能なすべての要素をHorizo​​ntalAlignment = "Stretch"に設定しました。

ユーザーがリストボックスを引き伸ばすと、ListboxItemsの背景が拡大するので、絶対値を入れたくありません。

ListBoxItemsの背景色がListBoxの幅を埋めるにはどうすればよいですか？

<Window x:Class="TestListBoxSelectedItemStyle.Window1"
    xmlns="http://schemas.Microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.Microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:TestListBoxSelectedItemStyle"
    Title="Window1" Height="300" Width="300">

    <Window.Resources>
        <local:CustomerViewModel x:Key="TheDataProvider"/>

        <DataTemplate x:Key="CustomerItemTemplate">
            <Border CornerRadius="5" Background="Orange" HorizontalAlignment="Stretch" Padding="5" Margin="3">
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Stretch" Width="Auto">
                    <TextBlock HorizontalAlignment="Stretch">
                    <TextBlock.Text>
                        <MultiBinding StringFormat="{}{0} {1}">
                            <Binding Path="FirstName"/>
                            <Binding Path="LastName"/>
                        </MultiBinding>
                    </TextBlock.Text>
                    </TextBlock>
                </StackPanel>
            </Border>
        </DataTemplate>

    </Window.Resources>

    <Grid>
        <ListBox ItemsSource="{Binding Path=GetAllCustomers, Source={StaticResource TheDataProvider}}"
                 ItemTemplate="{StaticResource CustomerItemTemplate}"/>
    </Grid>
</Window>
xamllistboxitem
336
Edward Tanguay

これは重複していると確信していますが、同じ答えの質問は見つかりません。

HorizontalContentAlignment="Stretch"をListBoxに追加します。これでうまくいくはずです。誤ってHorizontalAlignmentを取得するのは簡単なので、オートコンプリートには注意してください。

418
Matt Hamilton

私は両方の投稿に遭遇したので、 ここで別の解決策 を見つけました...

これはマイルズの答えからです：

<ListBox.ItemContainerStyle> 
    <Style TargetType="ListBoxItem"> 
        <Setter Property="HorizontalContentAlignment" Value="Stretch"></Setter> 
    </Style> 
</ListBox.ItemContainerStyle>

これは私のために働いた。

628
Gabriel Mongeon

アイテムがListBoxよりwideである場合、ここでの他の答えは役に立ちません：ItemTemplateのアイテムはListBoxよりも広いままです。

私のために働いた修正は、水平スクロールバーを無効にすることでした。これは、明らかに、すべてのアイテムのコンテナにリストボックスと同じ幅だけを残すように指示します。

したがって、リストボックスと同じ幅のリストボックスアイテムを取得するための結合された修正は、それらがより小さくて伸縮する必要があるか、より広くて折り返す必要があるかに関係なく、次のとおりです。

<ListBox HorizontalContentAlignment="Stretch" 
         ScrollViewer.HorizontalScrollBarVisibility="Disabled">

（ スクロールバーのアイデアに対するクレジット ）

66
Roman Starkov

簡単な回避策として、追加するパディングの量を決定するためにブレンドを使用したのと同じ問題もありました。私の場合は12だったので、負のマージンを使用して削除しました。これで、すべてを適切に中央揃えできるようになりました

0
Michael Ato Hutchful

境界線は視覚的な外観にのみ使用されるため、ListBoxItemのControlTemplateに配置し、そこでプロパティを変更できます。 ItemTemplateには、StackPanelとTextBlockのみを配置できます。このように、コントロールの外観はControlTemplateを介して制御され、表示されるデータはDataTemplateを介して制御されるため、コードもクリーンなままです。

0
Sangeetha

私の修正は、ItemsPresenterr内のScrollVieweにプロパティHorizontalAlignment="Stretch"を設定することでした。

これが誰かを助けることを願っています...

<Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListBox">
                    <ScrollViewer x:Name="ScrollViewer" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Foreground="{TemplateBinding Foreground}" Padding="{TemplateBinding Padding}" HorizontalAlignment="Stretch">
                        <ItemsPresenter  Height="252" HorizontalAlignment="Stretch"/>
                    </ScrollViewer>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
0
Ivica Marinčić