51

我想在表单中使用水平分隔线。据我所知,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  },

呈现以下分隔线:

在此处输入图像描述

4

8 回答 8

59

您可以尝试使用BoxView

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

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

于 2014-06-08T01:46:06.313 回答
12

Xamarin.Forms 中其实有一种显示分隔符的方法:

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

并隐藏:

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

希望能帮助到你!

于 2015-03-24T10:09:01.737 回答
11

@Jason除了Jason的回答,你应该设置VerticalOptions能够使用HeightRequest,并设置Horizo​​ntalOptions能够使用WidthRequest。默认值是填充,这就是它不响应的原因。示例输出

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

在此处输入图像描述

于 2017-02-20T07:04:48.270 回答
10

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}" />
于 2019-06-21T06:43:32.840 回答
5

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

这应该这样做

<StackLayout Orientation="Vertical">
       <Label HorizontalTextAlignment="Center" Text="Header" />
       <BoxView HeightRequest="1" BackgroundColor="Black" HorizontalOptions="FillAndExpand" />
</StackLayout>
于 2018-05-08T15:17:06.747 回答
4

添加 1pixel 堆栈对我有用(在垂直堆栈中):

// Add a black line
MyVerticalStackLayout.Children.Add(
    new StackLayout { 
        HeightRequest = 1, 
        BackgroundColor = Color.Black, 
        HorizontalOptions = LayoutOptions.FillAndExpand
     }    
);
于 2016-08-12T14:35:33.713 回答
3

你可以通过 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");
于 2014-11-25T06:07:30.343 回答
0

您还可以使用 NuGet 包Xamarin.Forms.Lab,其中包含许多有助于编码的自定义控件。

同样在这个包中,有一个带有分隔符的控件名称可以帮助你。

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

于 2014-10-11T06:58:34.960 回答