圆角列表框(Windows Store应用程序)

本文关键字:Store 应用程序 Windows 列表 圆角 | 更新日期: 2023-09-27 18:05:33

我在Flyout里面有一个ListBox。有什么办法使我的ListBox角圆润?我已经找过了,但什么也没找到。你有什么样式/Xaml模板推荐吗?

这是我的代码:

    <Flyout>
        <Flyout.FlyoutPresenterStyle>
          <Style TargetType="FlyoutPresenter">
             <Setter Property="Margin" Value="30,30,0,0"/>
             <Setter Property="Background" Value="Transparent"/>
             <Setter Property="BorderBrush" Value="Transparent"/>
             <Setter Property="BorderThickness" Value="0"/>
             <Setter Property="MinHeight" Value="300"/>
             <Setter Property="MinWidth" Value="200"/>
           </Style>
        </Flyout.FlyoutPresenterStyle>

        <ListBox x:Name="AllItemsView" Width="200" Height="auto" BorderThickness="0" VerticalAlignment="Top" Foreground="Black" Background="White" Grid.RowSpan="2" ItemsSource="{Binding}" SelectionMode="Single" SelectionChanged="AllItemsView_SelectionChanged">
           <ListBox.Resources>
              <Style TargetType="Border">
                 <Setter Property="CornerRadius" Value="20,20,20,20"/>
                 <Setter Property="BorderBrush" Value="BlueViolet"/>
                 <Setter Property="BorderThickness" Value="7"/>
                 <Setter Property="Padding" Value="5"/>
               </Style>
            </ListBox.Resources>
            <ListBox.ItemContainerStyle>
               <Style TargetType="ListBoxItem">
                   <Setter Property="Padding" Value="0"/>
                   <Setter Property="BorderThickness" Value="1"/>
               </Style>
          </ListBox.ItemContainerStyle>
           <ListBox.ItemTemplate>
              <DataTemplate>
               <Grid Width="200" Height="40" Margin="0,0,0,0" Name="colorGrid">
               <Grid.Background>
                   <SolidColorBrush Color="{Binding ItemType, Mode=OneWay, Converter={StaticResource ItemTypeToColorConverter1}}" />

               </Grid.Background>
               <StackPanel x:Name="StackItem">
                  <TextBlock Text="{Binding ItemTitle}" FontWeight="{Binding ItemType, Converter={StaticResource itemTypeToBoldConverter1}}" Margin="{Binding ItemType, Converter={StaticResource itemTypeToMarginConverter1}}" />
                  <TextBlock Text="{Binding ItemPage}" Visibility="Collapsed"/>
               </StackPanel>
               </Grid>
            </DataTemplate>
          </ListBox.ItemTemplate>
      </ListBox>
 </Flyout>

圆角列表框(Windows Store应用程序)

如果你想为ListBox设置CornerRadius,你也可以这样做,但是在参考资料中

 <ListBox ...>
        <ListBox.Resources>
            <Style TargetType="Border">
                <Setter Property="CornerRadius" Value="10"/>
            </Style>
        </ListBox.Resources>
    <!--...-->
</ListBox>