Xamarin.Forms 中的分隔符

Question

我想在表单中使用水平分隔符线。据我所知，Xamarin.Forms 没有提供。

有人可以提供分隔符的片段吗？

更新1

根据 Jason 的提议，这看起来不错：

// draws a separator line and space of 5 above and below the separator    
new BoxView() { Color = Color.White, HeightRequest = 5  },
new BoxView() { Color = Color.Gray, HeightRequest = 1, Opacity = 0.5  },
new BoxView() { Color = Color.White, HeightRequest = 5  },

渲染下面的分隔线：

Answer 1

您可以尝试使用

BoxView

// sl is a StackLayout
sl.Children.Add(new BoxView() { Color = Color.Black, WidthRequest = 100, HeightRequest = 2 });

尽管在我的测试中，宽度请求没有被遵循。 这可能是一个错误，或者其他设置可能会干扰它。

Answer 2

您可以在

app.xaml

文件中定义自己的分隔线。

<Style x:Key="Separator" TargetType="BoxView">
            <Setter Property="HeightRequest" Value="1" />
            <Setter Property="HorizontalOptions" Value="FillAndExpand" />
            <Setter Property="Color" Value="Gray" />
            <Setter Property="Margin" Value="0, 5, 0, 5" />
            <Setter Property="Opacity" Value="0.5" />
</Style>

并将其用作样式。

<BoxView Style="{StaticResource Separator}" />

Answer 3

除了Jason回答之外，您还应该将

VerticalOptions

设置为能够使用

HeightRequest

，并将

HorizontalOptions

设置为能够使用

WidthRequest

。默认值是 fill，这就是它不响应的原因。

输出示例：

<BoxView VerticalOptions="Center"
    HorizontalOptions="Center"
    HeightRequest="1"
    WidthRequest="50"
    Color="#5b5d68">
</BoxView>

Answer 4

Xamarin.Forms 中实际上有一种显示分隔符的方法：

myListView.SeparatorVisibility = Xamarin.Forms.SeparatorVisibility.Default;
myListView.SeparatorColor = Color.FromHex("C8C7CC");

隐藏：

myListView.SeparatorVisibility = Xamarin.Forms.SeparatorVisibility.None;

希望有帮助！

Answer 5

使用 Xaml 在 StackLayout 中实现 BoxView 的另一种方法。

这样应该可以了

<StackLayout Orientation="Vertical">
       <Label HorizontalTextAlignment="Center" Text="Header" />
       <BoxView HeightRequest="1" BackgroundColor="Black" HorizontalOptions="FillAndExpand" />
</StackLayout>

Answer 6

添加 1pixel 堆栈对我有用（在垂直堆栈中）：

// Add a black line
MyVerticalStackLayout.Children.Add(
    new StackLayout { 
        HeightRequest = 1, 
        BackgroundColor = Color.Black, 
        HorizontalOptions = LayoutOptions.FillAndExpand
     }    
);

Answer 7

你可以通过 StackLayout 来实现这一点。定义一个高度为 1 px、宽度为 320 px（iPhone 屏幕大小）的 StackLayout，然后将其添加到父布局中将会对您有所帮助。

StackLayout myLayout = new StackLayout();
myLayout.HeightRequest=1;
myLayout.WidthRequest=320;
myLayout.BackgroundColor= Color.Black;
parentLayout.Children.Add("myLayout");

Answer 8

您还可以使用 NuGet 包

Xamarin.Forms.Lab

，其中包含许多有助于编码的自定义控件。

此外，在这个包中，还有一个带有分隔符的控件名称，可能会对您有所帮助。

您可以从此链接下载该软件包： https://www.nuget.org/packages/XLabs.Forms/