Xamarin.Forms中编辑器的边框颜色

Question

如何在Xamarin.Forms中为Editor制作边框颜色？

我使用过这个链接,但它仅适用于Android.我希望它能在所有平台上运行!

我对此有点新手.请帮我.

任何的想法？

Answer 1

您也可以包装一下你用编辑器archieve这StackLayout与BackgroundColor="your color"和Padding="1",并设置BackgroundColor你的编辑器的相同颜色的形式.

像这样的东西:

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

不是那么花哨,但这至少会让你成为一个边界!

Answer 2

这是我使用的完整解决方案.你需要三件事.

1 - Editor在表单项目中实现的自定义类.

public class BorderedEditor : Editor
{

}

2 - EditoriOS项目中自定义的自定义渲染器.

public class BorderedEditorRenderer : EditorRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<Editor> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            Control.Layer.CornerRadius = 3;
            Control.Layer.BorderColor = Color.FromHex("F0F0F0").ToCGColor();
            Control.Layer.BorderWidth = 2;
        }
    }
}

3 - ExportRendereriOS项目中的一个属性,告诉Xamarin将自定义渲染器用于自定义编辑器.

[assembly: ExportRenderer(typeof(BorderedEditor), typeof(BorderedEditorRenderer))]

然后在Xaml中使用自定义编辑器:

<custom:BorderedEditor Text="{Binding TextValue}"/>

Answer 3

在您的便携式项目中添加此控件

 public class PlaceholderEditor : Editor
{
    public static readonly BindableProperty PlaceholderProperty =
        BindableProperty.Create("Placeholder", typeof(string), typeof(string), "");

    public PlaceholderEditor()
    {
    }

    public string Placeholder
    {
        get
        {
            return (string)GetValue(PlaceholderProperty);
        }

        set
        {
            SetValue(PlaceholderProperty, value);
        }
    }       
}

在你的 android 项目中添加这个渲染器：

[assembly: ExportRenderer(typeof(PlaceholderEditor), typeof(PlaceholderEditorRenderer))]
namespace Tevel.Mobile.Packages.Droid
{


public class PlaceholderEditorRenderer : EditorRenderer
{ 

public PlaceholderEditorRenderer() {  }

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

        if (e.NewElement != null)
        {
            var element = e.NewElement as PlaceholderEditor;

            this.Control.Background = Resources.GetDrawable(Resource.Drawable.borderEditText);

            this.Control.Hint = element.Placeholder;
        }
    }

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

        if (e.PropertyName == PlaceholderEditor.PlaceholderProperty.PropertyName)
        {
            var element = this.Element as PlaceholderEditor;
            this.Control.Hint = element.Placeholder;
        }
    }
}
}

在你的资源>可绘制中添加一个XML文件borderEditText.xml

 <?xml version="1.0" encoding="UTF-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:state_focused="true">
<shape android:shape="rectangle">
  <gradient
      android:startColor="#FFFFFF"
      android:endColor="#FFFFFF"
      android:angle="270" />
  <stroke
      android:width="3dp"
      android:color="#F8B334" />
  <corners android:radius="12dp" />
</shape>
  </item>
  <item>
<shape android:shape="rectangle">
  <gradient android:startColor="#FFFFFF" android:endColor="#FFFFFF"  android:angle="270" />
  <stroke android:width="3dp" android:color="#ccc" />
  <corners android:radius="12dp" />
</shape>
  </item>
</selector>

Xaml： 标头 -xmlns:ctrls="clr-namespace:my control namespace;assembly= my assembly" 控制：

<ctrls:PlaceholderEditor VerticalOptions="Fill" HorizontalOptions="StartAndExpand" Placeholder="add my comment title">
        </ctrls:PlaceholderEditor>

Answer 4

最简单的方法是在其周围添加框架。

 <Frame BorderColor="LightGray" HasShadow="False" Padding="0">
     <Editor/>
 </Frame>

Answer 5

您将需要为每个平台实现一个Custom Renderer（来自 Xamarin 的指南BorderColor），Entry因为Xamarin.Forms.

由于您已经设法在 Android 上更改BorderColor，因此您可以在此处找到适用于 iOS 的解决方案：http ://forums.xamarin.com/discussion/comment/102557/#Comment_102557