如何从 Xamarin Forms XAML 中的按钮中删除边距？

Question

我对 Xamarin 完全陌生，所以请耐心等待！ 不知何故，Xamarin 为我的所有按钮添加了一个神秘的边距，我不知道如何摆脱它。

这是我的代码：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="RockStamp.CameraSearch_Scan">

    <StackLayout Orientation="Vertical" Padding="0" Spacing="0">
      <StackLayout Orientation="Horizontal" Padding="0" Spacing="0">
      <Button  Text="Test" HeightRequest="50" WidthRequest="60" TextColor="#333333" x:Name="btnBack" VerticalOptions="Center" HorizontalOptions="Start" ></Button>
      <Label Text="Scan a..." FontSize="20" FontAttributes="Bold" BackgroundColor="{StaticResource BlueBackColor}" TextColor="White"  VerticalOptions="Start" HorizontalOptions="FillAndExpand" />
    </StackLayout>

    <Label Text="Steady now, we try to detect your..." FontSize="16"  VerticalOptions="Start" HorizontalOptions="Start" />

    <!-- Camera Placeholder -->
    <BoxView  HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="#eeeeee" ></BoxView>

    <StackLayout Orientation="Horizontal" Padding="0" Spacing="0">
      <Button Text="Cancel" TextColor="#333333" x:Name="btnCancel"  VerticalOptions="Center" HorizontalOptions="FillAndExpand" ></Button>
      <Button Text="Scan now!" TextColor="#333333" x:Name="btnScan"  VerticalOptions="Center" HorizontalOptions="FillAndExpand" ></Button>
    </StackLayout>

  </StackLayout >

</ContentPage>

这是一张图片：

您可以清楚地看到按钮周围的空间。它来自哪里 - 更重要的是：我该如何移除它？

Answer 1

问题是默认按钮背景包含这个边距。您必须将BackgroundColor 设置为一种颜色，并将BorderWidth 和BorderRadius 手动设置为零。

<Button
    BackgroundColor="Fuchsia"
    BorderRadius="0"
    BorderWidth="0"
    Text="Test"
    HeightRequest="50"
    WidthRequest="60"
    TextColor="#333333"
    x:Name="btnBack"
    Margin="0"
    VerticalOptions="Start"
    HorizontalOptions="Start" />

Answer 2

你可能已经解决了这个问题：

我解决这个问题的方法是在 android 上创建一个渲染器来覆盖 xamarin 上的按钮。

public class FixedMarginRenderer : ButtonRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            // remove default background image
            Control.Background = null;
            Control.SetBackgroundColor(Element.BackgroundColor.ToAndroid()); 
        }
    }

    protected override void OnElementPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
    {
        base.OnElementPropertyChanged(sender, e);

        if (e.PropertyName == "BackgroundColor")
        {
            // You have to set background color here again, because the background color can be changed later.
            Control.SetBackgroundColor(Element.BackgroundColor.ToAndroid());
        }
    }
} 

Answer 3

只是添加到 Sven-Michael Stübe 的answer。

如果您的按钮都不需要 Margin，则在您的 PCL 中创建 Style 或自定义控件（例如：MarginLessButton）。

Answer 4

手动设置BackgroundColor、BorderWidth 和BorderRadius 不再起作用。但是您可以使用平台配置来删除填充。阴影也需要去掉，否则会有一些垂直边距。

试试这样的：

using Xamarin.Forms;
using Xamarin.Forms.PlatformConfiguration;
using Xamarin.Forms.PlatformConfiguration.AndroidSpecific;

namespace MyControls
{
    public class ButtonNoMargin : Xamarin.Forms.Button
    {
        public ButtonNoMargin() : base()
        {
           this.On<Android>().SetUseDefaultPadding(false);
           this.On<Android>().SetUseDefaultShadow(false);
        }
    }
}

欲了解更多信息，请参阅https://github.com/xamarin/Xamarin.Forms/pull/1935