Avalonia跨平台入门第二十七篇再玩ListBox

WPF程序员

发布于 2024-01-26 15:29:24

2110

发布于 2024-01-26 15:29:24

今天再来分享一下我的最爱ListBox,看效果:

1、自定义一下ListBox的ItemsPanel:

<ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <Cores:CenterPanel InitAngle="{Binding Text, ElementName=InitAngleTxb}" IsClockwise="{Binding IsClockwise}"/>
    </ItemsPanelTemplate>
</ListBox.ItemsPanel>

2、自定义Panel:

public class CenterPanel : Panel

3、重写ArrangeOverride:

protected override Size ArrangeOverride(Size finalSize)
{
    int count = base.Children.Count;
    if(count == 0) return finalSize;
    //顺时针
    bool clockwise = IsClockwise;
    //初始角度
    double initialAngleDegrees = InitAngle;
    double step = (clockwise ? 1 : -1) * 360.0 / count;
    for(int i = 0; i < count; i++)
    {
        var item = base.Children[i];
        double width = item.DesiredSize.Width;
        double height = item.DesiredSize.Height;
        double angleDegrees = (initialAngleDegrees + step * i) % 360;
        angleDegrees = angleDegrees < 0 ? angleDegrees + 360 : angleDegrees;
        double angleRadians = angleDegrees * Math.PI / 180;
        double cosAngle = Math.Cos(angleRadians);
        double sinAngle = Math.Sin(angleRadians);
        double x = finalSize.Width * 0.5 + cosAngle * Radius - width * 0.5;
        double y = finalSize.Height * 0.5 + sinAngle * Radius - height * 0.5;
        item.Arrange(new Rect(x, y, width, height));
    }
    return finalSize;
}

4、关于ListBoxItem样式,就随便玩玩了:

<Style Selector="ListBoxItem">
  <Setter Property="Background" Value="Transparent"/>
  <Setter Property="BorderBrush" Value="Transparent"/>
  <Setter Property="BorderThickness" Value="0"/>
  <Setter Property="Padding" Value="10"/>
  <Setter Property="Width" Value="80"/>
  <Setter Property="Height" Value="80"/>
  <Setter Property="Template">
    <ControlTemplate>
      <Border Name="OutBorder" BorderBrush="#313A56" BorderThickness="0" CornerRadius="40" Margin="{TemplateBinding Padding}">
        <TextBlock Text="{Binding ID}" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="White" FontSize="16" FontFamily="{StaticResource diyFont}" />
      </Border>
    </ControlTemplate>
  </Setter>
</Style>

最终简单的效果先这样吧

;以后有时间的话,可以再去摸索一下更复杂的效果

;编程不息、Bug不止、无Bug、无生活

;改bug的冷静、编码的激情、完成后的喜悦、挖坑的激动、填坑的兴奋;这也许就是屌丝程序员的乐趣吧;今天就到这里吧;希望自己有动力一步一步坚持下去;生命不息,代码不止;大家抽空可以看看今天分享的效果,有好的意见和想法,可以在留言板随意留言;我看到后会第一时间回复大家,多谢大家的一直默默的关注和支持!如果觉得不错,那就伸出您的小手点个赞并关注一下！

本文参与腾讯云自媒体同步曝光计划，分享自微信公众号。

原始发表：2024-01-23，如有侵权请联系 cloudcommunity@tencent.com 删除

double