Xamarin.Forms入门困扰与解决方式-第三篇

有时候因应美工的需要,需要用底图搭配控制项来达到漂亮的外观,但是控制项自带的样式常常会抵触美工的设计,例如想要去除输入框自带的框线时,会发现Xamarin.Forms中的控制项可以变化外观的属性很少,此时就必须使用特别的技巧来达到目的;本文延续第二篇的案例,演示控制项自订外观的解决方式。

展示版本:Xamarin.Forms.1.3.5.6337

演示目标: 去除输入框的底线或外框线

Xamarin.Forms入门困扰与解决方式-第三篇_第1张图片

Xamarin.Forms入门困扰与解决方式-第三篇_第2张图片

想要客制化必须熟悉原生平台的API,步骤如下

1.Xamarin.Forms中的Entry控制项在Android下是用EditText实现,在iOS下是用UITextField实现,所以在解决方案的三个project中会分别新增三个空白类别,App1(Xamarin.Forms)新增CustomVisualElement.cs,App1.Droid新增CustomVisualElementRenderer.Android.cs,App1.iOS新增CustomVisualElementRenderer.iOS.cs

Xamarin.Forms入门困扰与解决方式-第三篇_第3张图片

2. 在CustomVisualElement.cs中定义要客制化的类别(必须继承自Xamarin.Forms的某个控制项),在另外两个档中用该平台的API去变化,Android是将EditText.Background设成null,iOS是将UITextField.BorderStyle设成None

Xamarin.Forms入门困扰与解决方式-第三篇_第4张图片

Xamarin.Forms入门困扰与解决方式-第三篇_第5张图片

Xamarin.Forms入门困扰与解决方式-第三篇_第6张图片

3.在Xaml中使用(ns1:MyEntry是客制控制项,Entry是原始控制项)

Xamarin.Forms入门困扰与解决方式-第三篇_第7张图片

参考资料

http://developer.xamarin.com/guides/cross-platform/xamarin-forms/custom-renderer


全文请参考:http://www.thinkpower.info/xamarin/cn/Article_18.aspx?idx=18#xamarin_top


你可能感兴趣的:(Xamarin,xamarin,APP应用开发,开发者,设计,解决方案)