Xamarin形成没有边框问题的按钮

Question

我尝试在视图中呈现可点击项目列表.我想添加一个带图像和白色边框的按钮(第一个).我发现StackLayout/ViewCell中的按钮无法呈现边框.

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage 
xmlns="http://xamarin.com/schemas/2014/forms" 
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
xmlns:controls="clr-namespace:XLabs.Forms.Controls;assembly=XLabs.Forms"
x:Class="*.PlacesPage"
Title="TEST">
<ContentPage.Padding>
    <OnPlatform x:TypeArguments="Thickness" iOS="0, 20, 0, 0" />
</ContentPage.Padding>
<ContentPage.Content>
    <Grid>
        <ListView x:Name="lvPlaces" ItemsSource="{Binding Places}" SeparatorColor="Gray" SeparatorVisibility="Default" RowHeight="120" >
            <ListView.ItemTemplate>
              <DataTemplate>
                  <ViewCell>
                    <ViewCell.View>
                        <StackLayout Orientation="Horizontal">
                            <Button HorizontalOptions="Center" VerticalOptions="Center" BorderWidth="3" BorderColor="White" Text="IMG"></Button>
                            <Button Text="{Binding Name}" BorderWidth="0" FontSize="20" BackgroundColor="Transparent" Clicked="OnButtonClickedPlace"></Button>
                        </StackLayout>
                    </ViewCell.View>
                  </ViewCell>
              </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </Grid>
</ContentPage.Content>

Answer 1

我正在使用Xamarin.Forms 2.3,我还试图创建一个按钮,没有边框半径,背景颜色设置为白色,边框颜色和宽度,以上所有答案都不适合我.

实际上我仍然需要将BorderRadius设置为1(我的宽度为2),并添加另一个我无法理解的解决方法:

在我的Android项目中,我为Button添加了一个自定义渲染器,其中没有任何内容.绝对没有.因此,当您使用默认渲染器时,以及使用从默认渲染器继承但尚未包含任何代码行的自定义渲染器时,Xamarin窗体的行为在Android上会有所不同.

我的渲染器:

[assembly: ExportRenderer(typeof(Xamarin.Forms.Button), typeof(GenericButtonRenderer))]

    namespace Express.CustomRenderers
{
    public class GenericButtonRenderer : Xamarin.Forms.Platform.Android.ButtonRenderer
    {
    }
}

Answer 2

在Xamarin.Forms中似乎存在一个问题,其中Button当ButtonRadius0为0 时,Android上不显示边框.(从Xamarin.Forms v2.0.0.6482开始,这个问题似乎没有得到解决.)它不太理想,因为它会略微改变按钮的外观,但你可以通过设置BorderRadius = 1Android 来解决它,或者所有平台,给角落略微感知的圆角.

解决方法(代码)

// HACK: fixes a bug where border doesn't work without a radius.
yourButton.BorderRadius = Device.OnPlatform<int>(iOS: 0, Android: 1, WinPhone: 0);

解决方法(XAML)

<Button
    x:Name="YourButton"
    Text="Some Button Text"
    TextColor="Black"
    Clicked="OnClickedDiscover"
    BackgroundColor="Aqua"
    BorderColor="Red"
    BorderWidth="1">
    <Button.BorderRadius>
        <!-- HACK: fixes a bug where border doesn't work without a radius. -->
        <OnPlatform x:TypeArguments="x:Int32">
            <OnPlatform.Android>1</OnPlatform.Android>
        </OnPlatform>
    </Button.BorderRadius>
</Button>

Answer 3

您使用的是安卓系统吗？如果是，那么：

在 Android 上，除非将 VisualElement.BackgroundColor 设置为非默认颜色，否则此属性不会产生任何效果。