Xamarin.Forms：从 Iconize 创建一个圆形/圆形按钮答案

【问题标题】：Xamarin.Forms: create a Rounded/Circle Button from IconizeXamarin.Forms：从 Iconize 创建一个圆形/圆形按钮
【发布时间】：2018-07-23 14:21:58
【问题描述】：

我尝试创建一个可以显示字体图标的圆形/圆形按钮。由于我已经在我的项目中使用了Iconize，因此我尝试从现有的IconButton 创建圆形/圆形按钮。

我首先尝试了这个，通过修复BorderRadiusas 的一半值HeightRequest/WidthRequest：

<iconize:IconButton HeightRequest="40" WidthRequest="40" 
                    BorderRadius="20"
                    Text="fa-500px" TextColor="Red" FontSize="20" 
                    BackgroundColor="Orange" BorderColor="Red"
                    BorderWidth="2" 
                    VerticalOptions="Start" HorizontalOptions="Center">
</iconize:IconButton>

默认渲染在 UWP 上按预期工作，但“点击”渲染效果不佳，因为出现了一个矩形。但是在 Android 上，按钮始终处于“默认”模式：没有边框，没有背景，...

所以我添加了一个 FlatButton 控件和一个适用于 Android 的 Renderer：

public class FlatButton : IconButton
{
}

[assembly: ExportRenderer(typeof(FlatButton), typeof(FlatButtonRenderer))]
namespace Iconize.Sample.Droid.Renderers
{
    public class FlatButtonRenderer : ButtonRenderer
    {
        protected override void OnDraw(Android.Graphics.Canvas canvas)
        {
            base.OnDraw(canvas);
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
        {
            base.OnElementChanged(e);
        }
    }
}

我是这样使用它的：

<controls:FlatButton HeightRequest="40" WidthRequest="40" 
                    BorderRadius="20"
                   Text="fa-500px" TextColor="Red" FontSize="20" 
                   BackgroundColor="Orange" BorderColor="Red"
                   BorderWidth="2" 
                   VerticalOptions="Start" HorizontalOptions="Center">
</controls:FlatButton>

这一次，圆角渲染在 Android 上没问题，但我失去了字体图标的“显示”。

这是截图：

有没有办法保持圆形渲染器和图标显示？第二次，有没有办法解决点击按钮时 UWP 上的渲染问题？

我还查看了其他插件：

Flexbutton: 好像工作正常，但是没有 UWP 支持
ButtonCirclePlugin：我无法在我的解决方案中使用它，也无法构建提供的示例...

您还有其他建议吗？

【问题讨论】：

标签： android button fonts xamarin.forms custom-renderer

【解决方案1】：

我终于找到了一个临时解决方案，像这样重新定义 Iconize IconButtonRenderer：

CircleIconButton：我创建了一个继承自 IconButton 的控件
CircleIconButtonRenderer：我为 Android 复制了 IconButtonRenderer。我不得不删除第一个调试测试，以及预期的构造函数新格式：public CircleIconButtonRenderer(Context context) : base(context)。所以这个类显示为“过时”。
MainPage：我已经在页面中实现了新控件，就像我们为 IconButton 所做的那样。

但可能有更好的方法，因为预期的构造函数没有实现......

【讨论】：