0

WPFで垂直ラジオボタンを水平に表示するにはどうすればよいですか

私は WPF プロジェクトに取り組んでおり、このコードを使用して、データ ソースにバインドされるリスト ボックス ラジオ グループを作成しています。

以下のコードを使用して、ラジオボタン付きのリストボックスを作成し、それをデータソースにバインドしました

コード :

`<Window.Resources>
    <Style x:Key="radioListBox" TargetType="ListBox" BasedOn="{StaticResource {x:Type ListBox}}">
        <Setter Property="BorderThickness" Value="0" />
        <Setter Property="Margin" Value="5" />
        <Setter Property="DisplayMemberPath" Value="Text" />
        <Setter Property="SelectedValuePath" Value="Value" />
        <Setter Property="Background" Value="{x:Null}" />
        <Setter Property="ItemContainerStyle">
            <Setter.Value>
                <Style TargetType="ListBoxItem" BasedOn="{StaticResource {x:Type ListBoxItem}}">
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="ListBoxItem">
                                <Grid Background="Transparent">
                                    <RadioButton Focusable="False"  Margin="5,5,5,5" IsHitTestVisible="False" IsChecked="{TemplateBinding IsSelected}">
                                        <ContentPresenter />
                                    </RadioButton>
                                </Grid>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </Setter.Value>
        </Setter>
    </Style>
    </Window.Resources>



<DockPanel>
    <!-- StatusBar just to make sure two-way binding is working properly -->
    <StatusBar DockPanel.Dock="Bottom" BorderBrush="Black" BorderThickness="0,1,0,0">
        <TextBlock Text="{Binding CurrentChild.Details}" TextWrapping="Wrap" />
    </StatusBar>

    <!-- Details pane -->
    <Border Margin="5" BorderBrush="LightGray" BorderThickness="1">
        <Grid>
            <Grid.Resources>
                <!-- Common style for header labels -->
                <Style TargetType="Label">
                    <Setter Property="HorizontalAlignment" Value="Right" />
                    <Setter Property="VerticalAlignment" Value="Top" />
                    <Setter Property="FontWeight" Value="Bold" />
                    <Setter Property="Margin" Value="5,2" />
                </Style>
            </Grid.Resources>

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" MinWidth="104" />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>

            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" MinHeight="27" />
                <RowDefinition Height="Auto" MinHeight="27" />
            </Grid.RowDefinitions>


            <Label Grid.Row="3" Content="My Sample Numbers:" />

            <ListBox Grid.Row="3" Grid.Column="1" Style="{StaticResource radioListBox}" 
                     ItemsSource="{Binding MyNumberTypes}" Height="Auto" Margin="5,4,5,0" VerticalAlignment="Top" />
        </Grid>
    </Border>
</DockPanel>`



    public IEnumerable<ValueAndText<NumType>> MyNumberTypes
        {
            get
            {
                yield return new ValueAndText<NumType>(NumType.One, "One");
                yield return new ValueAndText<NumType>(NumType.Two, "Two");
                yield return new ValueAndText<NumType>(NumType.Three, "Three");
                yield return new ValueAndText<NumType>(NumType.Four, "Four");
                yield return new ValueAndText<NumType>(NumType.Five, "Five");
                yield return new ValueAndText<NumType>(NumType.Six, "Six");
                yield return new ValueAndText<NumType>(NumType.Seven, "Seven");
                yield return new ValueAndText<NumType>(NumType.Eight, "Eight");
                yield return new ValueAndText<NumType>(NumType.Nine, "Nine");
            }
        }`

すべてが正常に機能していますが、問題は、すべてのラジオ ボタンをジグザグ スタイルで表示する必要があることです。私のフォームにはラジオ ボタンを垂直に配置するスペースがあまりないため、これらのラジオ ボタンを水平に表示できるように表示する方法はありますか?

たとえば（画像を投稿できません）

One   Two   Three
Four  Five  Six
Seven Eight Nine
4

1 に答える 1

1

リストボックス スタイルでスタイルを設定できますItemsPanel。radioListBoxスタイルに追加:

<Setter Property="ItemsPanel">
 <Setter.Value>
  <ItemsPanelTemplate>
   <UniformGrid Columns="3" />
  </ItemsPanelTemplate>
 </Setter.Value>
</Setter>

3 列のグリッドにラジオボタンを表示します。ItemsPanelを使用すると、アイテムが表示されるコンテナを変更できます。

于 2013-03-18T09:20:13.580 に答える