【Anychart教程】在您的Xamarin應用程式中建立美觀且使用者友好的表單
阿新 • • 發佈:2018-11-27
幾乎每個移動應用都有收集使用者輸入的場景。正是考慮到這一點,我們為Xamarin的Telerik UI引入了Entry控制元件,以幫助您建立漂亮且使用者友好的表單。
在Telerik UI中為Xamarin引入新條目
用於Xamarin Entry的Telerik UI 是一個輸入控制元件,它接受字串作為輸入,併為您提供自定義外觀的選項,因此它與應用程式的其餘部分保持一致。它擴充套件了預設的Xamarin Forms Entry控制元件,並在其上添加了以下功能:
- 支援Telerik主題機制
- 可定製的水印
- 自定義它周圍的邊框
- 支援Xamarin.Forms條目的所有功能,例如密碼輸入和考慮預期輸入的定義虛擬鍵盤
在下面的部分中,我將為您提供一些快速示例,說明如何利用控制元件的主要功能。
自定義水印
水印用於為終端使用者提供應輸入的文字的指導。您可以通過WatermarkTextColor屬性輕鬆更改水印的顏色。看看下面的程式碼:
<telerikInput:RadEntry BackgroundColor="White" WatermarkText="only letters and numbers" TextColor="Black" WatermarkTextColor="#C0C0C0"> <telerikInput:RadEntry.Padding> <OnPlatform x:TypeArguments="Thickness"> <On Platform="Android,UWP" Value="10,10,0,10" /> <On Platform="iOS" Value="10,10,0,20" /> </OnPlatform> </telerikInput:RadEntry.Padding> <telerikInput:RadEntry.BorderStyle> <telerikInput:BorderStyle CornerRadius="8" BorderColor="#808080" BorderThickness="1" /> </telerikInput:RadEntry.BorderStyle> </telerikInput:RadEntry>
這就是它在iOS模擬器上的外觀:
自定義控制元件的外觀和感覺
Entry控制元件允許您自定義其視覺外觀,以使其適合您的應用程式的設計。下面是一個示例,說明如何利用BorderStyle,Padding等條目樣式功能使您的表單更漂亮,並更好地捕獲終端使用者的注意力:
<telerikInput:RadEntry BackgroundColor="#26A6D1" WatermarkText="Enter First Name" TextColor="White"> <telerikInput:RadEntry.HeightRequest> <OnPlatform x:TypeArguments="x:Double"> <On Platform="Android, iOS" Value="40"/> <On Platform="UWP" Value="-1"/> </OnPlatform> </telerikInput:RadEntry.HeightRequest> <telerikInput:RadEntry.Padding> <OnPlatform x:TypeArguments="Thickness"> <On Platform="Android,UWP" Value="10,10,0,10" /> <On Platform="iOS" Value="10,10,0,20" /> </OnPlatform> </telerikInput:RadEntry.Padding> <telerikInput:RadEntry.BorderStyle> <telerikInput:BorderStyle CornerRadius="0" BorderColor="White" BorderThickness="1"> </telerikInput:BorderStyle> </telerikInput:RadEntry.BorderStyle> </telerikInput:RadEntry>
這是iOS模擬器上的結果:
購買Telerik正版授權,請點選“諮詢線上客服”喲!