WPF ComboBox - 垂直显示,45°旋转项目

时间:2011-04-17 12:46:02

标签: wpf combobox rotation

我想在WPF中使用ComboBox来存储一些名称,但我希望组合框本身是垂直的,当你点击它时,它会显示每个项目的另一个45°旋转,以便它更具可读性。像:l / / / /

我实现了一些这样做:

                        <ComboBox Name="combo" 
                                  Grid.Row="0" Grid.Column="1" 
                                  HorizontalAlignment="Center" 
                                  VerticalAlignment="Center">
                            <ComboBox.LayoutTransform>
                                <RotateTransform Angle="270" />
                            </ComboBox.LayoutTransform>
                            <ComboBox.Items>                                
                                <TextBox>
                                    <TextBox.LayoutTransform>
                                        <RotateTransform Angle="315" />
                                    </TextBox.LayoutTransform>
                                </TextBox>
                            </ComboBox.Items>
                        </ComboBox>

我像这样填充组合框:

        m_Main.combo.Items.Clear();
        foreach (PlayerInfo player in m_CurrentData.PlayersInfo)
        {
            m_Main.comboPlayer1.Items.Add(player.Name);                    
        }

但是只有第一个项目被旋转,而且我在实际项目的顶部得到一个空白项目(我在运行时填充组合框项目)。 我做错了什么?

编辑:我清除项目时不再有空白项目。

3 个答案:

答案 0 :(得分:3)

这是有效的(如果我正确理解你想要的东西)

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <Grid>  
    <ComboBox HorizontalAlignment="Center" VerticalAlignment="Center" MinWidth="100">
      <ComboBox.LayoutTransform>
        <RotateTransform Angle="270" />
      </ComboBox.LayoutTransform>
      <ComboBox.ItemsPanel>
        <ItemsPanelTemplate>
          <StackPanel Orientation="Vertical" IsItemsHost="True">
            <StackPanel.LayoutTransform>
              <RotateTransform Angle="90" />
            </StackPanel.LayoutTransform>
          </StackPanel>
        </ItemsPanelTemplate>
      </ComboBox.ItemsPanel>
      <ComboBox.ItemContainerStyle>
        <Style TargetType="ComboBoxItem">
          <Setter Property="LayoutTransform">
            <Setter.Value>
              <RotateTransform Angle="315" />
            </Setter.Value>
          </Setter>
        </Style>
      </ComboBox.ItemContainerStyle>
      <ComboBoxItem>Hello</ComboBoxItem>
      <ComboBoxItem>World</ComboBoxItem>
      <ComboBoxItem>Foo</ComboBoxItem>
      <ComboBoxItem>Bar</ComboBoxItem>
    </ComboBox>
  </Grid>
</Page>

enter image description here

答案 1 :(得分:0)

你可能需要覆盖这样的组合框项目模板 -

<ComboBox Name="combo"
              HorizontalAlignment="Center"
              VerticalAlignment="Center">
        <ComboBox.LayoutTransform>
            <RotateTransform Angle="270" />
        </ComboBox.LayoutTransform>
        <ComboBox.ItemTemplate>
            <DataTemplate>
                 <TextBox Text="{Binding Mode=OneWay}">
                <TextBox.LayoutTransform>
                    <RotateTransform Angle="315" />
                </TextBox.LayoutTransform>
            </TextBox>
            </DataTemplate>
        </ComboBox.ItemTemplate>
    </ComboBox>

答案 2 :(得分:0)

您可以使用DataTemplate并在Binding媒体资源中添加TextBox.Text。现在我假设您要编辑名称,因为您使用的是TextBox。就目前而言,您的代码不支持编辑这些字符串,因为它们是不可变的。所以我的回答是假设你想编辑它们:

<ComboBox x:Name="combo" 
          Grid.Row="0" Grid.Column="1" 
          HorizontalAlignment="Center" 
          VerticalAlignment="Center">
    <ComboBox.Resources>         
        <DataTemplate DataType="{x:Type local:PlayerInfo}">
             <TextBox Text="{Binding Name}">
                 <TextBox.LayoutTransform>
                     <RotateTransform Angle="270" />
                 </TextBox.LayoutTransform>
             </TextBox>
        </DataTemplate>
    </ComboBox.Resources>
</ComboBox>

您的代码背后应将ItemsSource设置为m_CurrentData.PlayersInfo

this.combo.ItemsSource = m_CurrentData.PlayersInfo;

理想情况下,这可以通过XAML中的绑定来完成,但是这样就可以了。请务必在XAML中设置xmlns:local定义,以便DataType上的DataTemplate有效。