0

ListBox のフォーカス/選択項目を変更しようとしています。私のアプリケーションはこの記事に基づいています。現時点では、データ テンプレートを使用して ListBoxItem スタイルを設定しようとしています。

    <DataTemplate x:Key="ItemTemplate">
        <TextBlock Text="{Binding}" 
                   Foreground="Black" 
                   FontFamily="Segoe UI" 
                   FontSize="22"
                   HorizontalAlignment="Left"
                   Padding="15,10,0,0"
                   />
    </DataTemplate>

    <DataTemplate x:Key="SelectedTemplate">
        <TextBlock Text="{Binding}" 
                   Foreground="Red" 
                   FontFamily="Segoe UI" 
                   FontSize="30"
                   HorizontalAlignment="Left"
                   Padding="15,10,0,0"
                   />
    </DataTemplate>

私のアイデアは、トリガーを使用してこれらのテンプレートを切り替えることでした。

<Style TargetType="{x:Type ListBoxItem}" x:Key="ContainerStyle">
        <Setter Property="ContentTemplate" Value="{StaticResource ItemTemplate}" />
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="ContentTemplate" Value="{StaticResource SelectedTemplate}" />
            </Trigger>
        </Style.Triggers>
    </Style>

ListBox は次のようになります。

<ListBox x:Name="valuesItemsCtrl" 
         BorderThickness="0" 
         ItemContainerStyle="{StaticResource ContainerStyle}"
         Background="Transparent"
         Tag="{Binding }">
    <ListBox.AlternationCount>
        <Binding>
            <Binding.Path>Values.Count</Binding.Path>
        </Binding>
    </ListBox.AlternationCount>
        <ListBox.ItemsSource>
            <Binding>
                <Binding.Path>Values</Binding.Path>
            </Binding>
        </ListBox.ItemsSource>
        <ListBox.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel />
            </ItemsPanelTemplate>
        </ListBox.ItemsPanel>
    </ListBox>

最後に、テンプレートを別の ListBox に追加します。

<ListBox x:Name="tumblersCtrl" 
                 BorderThickness="0" 
                 Background="Transparent" 
                 ItemsSource="{Binding Tumblers, ElementName=thisCtrl}" 
                 ItemTemplate="{StaticResource TumblerTemplate}">
</ListBox>

助けやヒントをありがとう!

4

2 に答える 2

1

使用ItemTemplateおよびデータ トリガー:

<ListBox ItemsSource="{Binding}">
    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="IsSelected" Value="{Binding IsSelected}"/>
        </Style>
    </ListBox.ItemContainerStyle>
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Name}" 
                       Foreground="Black" 
                       FontFamily="Segoe UI" 
                       FontSize="22" 
                       HorizontalAlignment="Left" 
                       Padding="15,10,0,0"
                       x:Name="tbName"/>
            <DataTemplate.Triggers>
                <DataTrigger Binding="{Binding IsSelected}" Value="True">
                    <Setter TargetName="tbName" Property="Foreground" Value="Red"/>
                    <Setter TargetName="tbName" Property="FontSize" Value="30"/>
                </DataTrigger>
            </DataTemplate.Triggers>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

ここで、バインドされたデータは次のコレクションです。

public class ViewModel : ViewModelBase
{
    public String Name
    {
        get { return name; }
        set
        {
            if (name != value)
            {
                name = value;
                OnPropertyChanged("Name");
            }
        }
    }
    private String name;

    public Boolean IsSelected
    {
        get { return isSelected; }
        set
        {
            if (isSelected != value)
            {
                isSelected = value;
                OnPropertyChanged("IsSelected");
            }
        }
    }
    private Boolean isSelected;
}

ウィンドウの分離コード:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new[]
        {
            new ViewModel { Name = "John", IsSelected = true },
            new ViewModel { Name = "Mary" },
            new ViewModel { Name = "Pater" },
            new ViewModel { Name = "Jane" },
            new ViewModel { Name = "James" },
        };
    }
}
于 2012-09-12T11:14:22.160 に答える
0

テンプレートを変更する場合は、 を使用しますDataTemplateSelector

ContainerStyle を破棄し、代わりにListBox.ItemsTemplateSelectorカスタム datatemplateselector を静的リソースとして設定します。

このリンクで詳細な例を見つけることができます。

EDIT: あなたのコメントによると、DataTemplateは必要ありません.Triggerにこれらの2つのプロパティを設定するだけです:

<Style TargetType="{x:Type ListBoxItem}" x:Key="ContainerStyle">
    <Setter Property="Foreground" Value="Black" />
    <Setter Property="FontSize" Value="22" />
    <Setter Property="FontFamily" Value="Segoe UI" />
    <Setter Property="HorizontalAlignment" Value="Left" />
    <Setter Property="Padding" Value="15,10,0,0" />
    <Style.Triggers>
        <Trigger Property="IsSelected" Value="True">
            <Setter Property="Foreground" Value="Red" />
            <Setter Property="FontSize" Value="30" />
        </Trigger>
    </Style.Triggers>
</Style>
于 2012-09-12T09:59:30.577 に答える