UWP内のComboBoxのドロップダウンリスト

Question

私は普遍的なアプリケーションにComboBoxを持っています。 ComboBoxのドロップダウンリストの位置を変更するにはUWP？

Answer 1

ComboBoxのドロップダウンは実際にはPopupであり、このPopupを表示する位置はコードの背後に定義されており、アクセスできません。 1つの回避策は、このPopupを見つけて開いたときに再配置しますが、この方法を使用すると、開かれる度にVerticalOffsetプロパティを計算する必要があり、異なる値のシナリオが非常に多いVerticalOffsetです。

<Button x:Name="rootButton" BorderBrush="Gray" BorderThickness="2" Click="Button_Click" MinWidth="80" Background="Transparent" Padding="0"> 
    <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch" 
      Width="{Binding ElementName=rootButton, Path=ActualWidth}"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*" /> 
      <ColumnDefinition Width="32" /> 
     </Grid.ColumnDefinitions> 
     <TextBlock Text="{x:Bind selectedItem, Mode=OneWay}" Grid.Column="0" VerticalAlignment="Center" FontSize="15" HorizontalAlignment="Center" /> 
     <FontIcon Grid.Column="1" FontSize="12" FontFamily="Segoe MDL2 Assets" Glyph="&#xE0E5;" HorizontalAlignment="Right" 
       Margin="0,10,10,10" VerticalAlignment="Center" /> 
    </Grid> 
    <FlyoutBase.AttachedFlyout> 
     <MenuFlyout Placement="Bottom" x:Name="menuFlyout"> 
      <MenuFlyoutItem Text="Item 1" Click="MenuFlyoutItem_Click" /> 
      <MenuFlyoutItem Text="Item 2" Click="MenuFlyoutItem_Click" /> 
      <MenuFlyoutItem Text="Item 3" Click="MenuFlyoutItem_Click" /> 
      <MenuFlyoutItem Text="Item 4" Click="MenuFlyoutItem_Click" /> 
      <MenuFlyoutItem Text="Item 5" Click="MenuFlyoutItem_Click" /> 
     </MenuFlyout> 
    </FlyoutBase.AttachedFlyout> 
</Button> 

このUserControlで背後にあるコード：

public sealed partial class CustomComboBox : UserControl, INotifyPropertyChanged 
{ 
    public CustomComboBox() 
    { 
     this.InitializeComponent(); 
     selectedItem = ""; 
    } 

    private string _selectedItem; 

    public string selectedItem 
    { 
     get { return _selectedItem; } 

     set 
     { 
      _selectedItem = value; 
      if (PropertyChanged != null) 
      { 
       PropertyChanged(this, new PropertyChangedEventArgs("selectedItem")); 
      } 
     } 
    } 

    public event PropertyChangedEventHandler PropertyChanged; 

    private void MenuFlyoutItem_Click(object sender, RoutedEventArgs e) 
    { 
     var item = sender as MenuFlyoutItem; 
     selectedItem = item.Text; 
    } 

    private void Button_Click(object sender, RoutedEventArgs e) 
    { 
     FlyoutBase.ShowAttachedFlyout(sender as Button); 
    } 
} 

そして

だから私の提案は、例えば、私はこのようなUserControlを作成ComboBoxような行動、カスタムコントロールを設計しています他のページにこのようなCustomComboBoxを使用することができます：

<local:CustomComboBox VerticalAlignment="Center" HorizontalAlignment="Center" /> 

このCustomComboBoxのデフォルトでは、DropDownを保持するための十分なスペースがない限り、そのDropDownのリストが表示されます。この場合、DropDownはこのCustomComboBoxの上に表示されます。