ComboBox项目处于全模式和普通模式

时间:2014-08-05 21:00:00

标签: c# xaml windows-phone-8 windows-runtime windows-phone

我希望显示一个强调色选择器,就像系统中内置的一样。

当它处于完整模式时,我希望它显示为具有可用颜色的图块,当它显示为下拉列表时,我希望它在它旁边显示为一个小方块和颜色名称。

问题是我不知道如何为全模式和下拉模式设置两个模板。

<ComboBox SelectionChanged="AccentColor_SelectionChanged">
    <ComboBoxItem>
        <ComboBoxItem.Content>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Rectangle Grid.Column="0" Fill="Yellow" Width="20" Height="20"/>
                <TextBlock Grid.Column="1" Text="Yellow" />
            </Grid>
        </ComboBoxItem.Content>
    </ComboBoxItem>
    <ComboBoxItem>
        <ComboBoxItem.Content>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Rectangle Grid.Column="0" Fill="Blue" Width="20" Height="20"/>
                <TextBlock Grid.Column="1" Text="Blue" />
            </Grid>
        </ComboBoxItem.Content>
    </ComboBoxItem>
</ComboBox>

这仅适用于下拉模式。我怎样才能实现它? (这是一个Windows PHone Runtime应用程序。)

2 个答案:

答案 0 :(得分:0)

通常在wp8中,当下拉列表中的项目数量超过5个项目时,它将自动转为全屏模式。这将只显示一个下拉列表..

在listpicker中有一个属性调用ExpantionMode..try或者以下链接可以帮助你..

  http://msdn.microsoft.com/en-us/library/windows/apps/xaml/hh868195.aspx

答案 1 :(得分:0)

试试这个..根据您的要求进行编辑。

我刚刚粘贴了我的代码。

<wpToolkit:ListPicker Name="cmbCountry"  Background="#FFF9E2"  Foreground="#333333" Grid.Column="0"  ExpansionMode="FullScreenOnly" ItemsSource="{Binding Countries}"  SelectionChanged="cmbCountry_SelectionChanged_1">
    <wpToolkit:ListPicker.ItemTemplate>
         <DataTemplate>
                <TextBlock Text="{Binding CountryName}" FontSize="20"></TextBlock>
           </DataTemplate>
     </wpToolkit:ListPicker.ItemTemplate>
     <wpToolkit:ListPicker.FullModeItemTemplate>
           <DataTemplate>
                 <Border BorderBrush="#FFF9E2" BorderThickness="0,0,0,3">
                        <StackPanel Orientation="Horizontal" Width="425">
                               <TextBlock Text="{Binding CountryName}" FontSize="35"></TextBlock>
                        </StackPanel>
                  </Border>
           </DataTemplate>
    </wpToolkit:ListPicker.FullModeItemTemplate>