在 Android 上带有彩色边框的 Xamarin 表单条目答案

【问题标题】：Xamarin Forms Entry with coloured border on Android在 Android 上带有彩色边框的 Xamarin 表单条目
【发布时间】：2018-09-19 17:25:31
【问题描述】：

我已经为我的应用程序制作了一个自定义呈现的条目，现在它只是为文本添加了填充。即使用户专注于条目，我也希望边框颜色始终为蓝色。我现在在我的 Android 自定义条目中有这段代码（取自 here，但它不起作用，它只是添加了一个蓝色背景）：

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

        if (Control != null)
        {
            var view = (BlueBorderEntry)Element;
            GradientDrawable gd = new GradientDrawable();

            //Below line is useful to give border color
            gd.SetColor(global::Android.Graphics.Color.Rgb(45, 192, 232));


            this.Control.SetBackgroundDrawable(gd);
            this.Control.SetPadding(40, 40, 40, 40);


            this.Control.SetRawInputType(InputTypes.TextFlagNoSuggestions);
        }
    }

我探索了可能设置边框颜色的方法并发现：

this.Control.SetCompoundDrawables();

具体描述为：

将可绘制对象设置为显示在文本的左侧、上方、右侧和下方。

然而，在传入一个蓝色的 Drawable 之后，它对我的条目完全没有任何作用。

我似乎无法弄清楚如何让边框变成蓝色，如果有人可以帮助我吗？

编辑：我需要边框位于条目的底部并且大约 5px 厚。

【问题讨论】：

标签： android xamarin.forms xamarin.android

【解决方案1】：

您可以在没有渲染器的情况下使用 Frame 并将 Entry 放入框架内，并为框架设置边框颜色。这是一种简单的方法。

或者你可以修改你的渲染器：

public class CustomEntryRenderer : EntryRenderer { protected override void OnElementChanged(ElementChangedEventArgs<Entry> e) { base.OnElementChanged(e); if (e.OldElement == null) { var nativeEditText = (global::Android.Widget.EditText)Control; var shape = new ShapeDrawable(new Android.Graphics.Drawables.Shapes.RectShape()); shape.Paint.Color = Xamarin.Forms.Color.Red.ToAndroid(); shape.Paint.SetStyle(Paint.Style.Stroke); nativeEditText.Background = shape; } } }

【讨论】：

这在文本周围添加了一个蓝色边框，这很棒，但我刚刚意识到我忘了提到我只想要条目底部的边框..

【解决方案2】：

通常，我不喜欢变通办法，但这太难以忽视了：

<FooLayout BackgroundColor="White">
  <StackLayout BackgroundColor="Black" Padding="1">
      <Entry BackgroundColor="White" />
  </StackLayout>
    ...
 </FooLayout>

FooLayout 是任何布局的类比

【讨论】：

【解决方案3】：

我使用了一种解决方法，我在条目下方添加了一个 BoxView，其宽度与条目相同，HeightRequest 为 5

<customrenderers:BlueBorderEntry x:Name="username" Text="" Placeholder="Email" WidthRequest="150" Margin="35, 0, 35, 0"/>
<BoxView WidthRequest="150" HeightRequest="5" BackgroundColor="#8ad6ea" Margin="35, 0, 35, 20"/>

【讨论】：