Question

我尝试创建一个圆角/圆形按钮，可以显示字体图标。由于我已在项目中使用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上按预期工作，但是＆＃34;点击＆＃34;渲染效果不佳，因为出现了一个矩形。但是在Android上，按钮始终处于＆＃34;默认＆＃34;模式：没有边框，没有背景，......

所以我为Android添加了 FlatButton 控件和渲染器：

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上运行良好，但我已经失去了＆＃34;显示＆＃34;字体图标。

以下是截图：

有没有办法保持圆角渲染器和图标显示？第二次，有没有办法在单击按钮时修复UWP上的渲染问题？

我还看了其他插件：

Flexbutton：似乎工作正常，但没有UWP支持
ButtonCirclePlugin：我无法在我的解决方案中使用它，而且我无法构建提供的示例......

您还有其他建议吗？

Answer 1

我终于找到了一个临时解决方案，重新定义Iconize IconButtonRenderer，如下所示：

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

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

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

1 个答案: