代码之家 › 专栏 › 技术社区 › Rodney Hickman MattW

如何使用图标、占位符标签和带曲线角的边框构建自定义Xamarin表单条目?

custom-renderer xamarin.forms xaml c#

Rodney Hickman MattW · 技术社区 · 6 年前

我需要做一个Xamarin表单自定义条目。该条目需要一个图标、圆角边框和占位符标签。这是一个需要的模型

那么,是否可以在没有自定义条目呈现器的情况下构建此条目?如果需要,如何将标签放入自定义呈现器中。

1 回复 | 直到 6 年前

Andrew 6 年前

你可以自己动手,但其他人已经为你做了所有的辛苦工作。看一看这个 Xfx.Controls 图书馆。这个 XfxEntry

抓住那个 nuget package
确保你 initialize the library 在你的Android和iOS项目中。
在将要使用它的xaml页面的顶部,将库导入 xmlns:xfx="clr-namespace:Xfx;assembly=Xfx.Controls"

使用控件,例如:

<xfx:XfxEntry Placeholder="Email"
      Text="{Binding Email}" />

<Frame x:Class="App1.MyCustomEntry"
   xmlns="http://xamarin.com/schemas/2014/forms"
   xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
   xmlns:xfx="clr-namespace:Xfx;assembly=Xfx.Controls"
   BorderColor="LightBlue"
   CornerRadius="15" HorizontalOptions="FillAndExpand">
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="2*" />
        <ColumnDefinition Width="8*" />
    </Grid.ColumnDefinitions>
    <Image Grid.Column="0" Source="email.png" />
    <xfx:XfxEntry Grid.Column="1" Placeholder="Email*" />
</Grid>

注意 BorderColor 和 CornerRadius public partial class MyCustomEntry : Frame .

从这里开始,只需将控件插入页面:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
         xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
         xmlns:local="clr-namespace:App1"
         x:Class="App1.MainPage">

    <local:MyCustomEntry VerticalOptions="Center" HorizontalOptions="Center" />

</ContentPage>