Xamarin.Form中使用自定义Entry输入框(只有Android)

首先看xamarin.form项目结构
Xamarin.Form中使用自定义Entry输入框(只有Android)_第1张图片

第一步:在xamarin.form中添加BorderlessEntry类 这个类继承自Xamarin.Forms.Entry来移除Android平台中Entry控件的边界。.

using System;
using System.Collections.Generic;
using System.Text;
using Xamarin.Forms;
using Xamarin.Forms.Internals;

namespace JHXSP.Controls
{
    /// 
    /// 这个类继承自Xamarin.Forms.Entry来移除Android平台中Entry控件的边界。.
    /// 
    [Preserve(AllMembers = true)]
    public class BorderlessEntry : Entry
    {

    }
}

第二步:在xamarin.android 项目中创建Renderers文件夹下的BorderlessEntryRenderer.cs类

using Android.Graphics;
using Android.Graphics.Drawables;
using Android.Views;
using Xamarin.Forms;
using Xamarin.Forms.Platform.Android;

[assembly: ExportRenderer(typeof(JHXSP.Controls.BorderlessEntry), typeof(JHXSP.Droid.Renderers.BorderlessEntryRenderer))]

namespace JHXSP.Droid.Renderers
{
    public class BorderlessEntryRenderer: EntryRenderer
    {
        private Paint mPaint;
        public BorderlessEntryRenderer() : base(Android.App.Application.Context)
        {
            
        }

        protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
        {
            base.OnElementChanged(e);
            //mPaint = new Paint();
            //this.Control.SetBackground(null);
            GradientDrawable gd = new GradientDrawable(); //创建GradientDrawable对象
            Control.Gravity = GravityFlags.CenterVertical;
            Control.SetPadding(10, 10, 10, 10); //设置内边距
            gd.SetCornerRadius(5); //边框圆角
            gd.SetStroke(2, Android.Graphics.Color.LightGray);//边框宽度和边框颜色
            Control.SetBackgroundDrawable(gd); //将配置设置到Form中的对应类
        }

    }
}

关于GradientDrawable类,找到一篇很好的文章GradientDrawable的详解

第三步:在xaml页面进行使用

  1. 引入xmlns:control=“clr-namespace:JHXSP.Controls” (只针对于本项目,注意项目名字及文件夹名字)
  2. 标签的使用 : control:BorderlessEntry

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
               xmlns:control="clr-namespace:JHXSP.Controls" 
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:JHXSP.ViewModels"
             x:Class="JHXSP.Views.Setting">
    <ContentPage.BindingContext>
        <local:SettingViewModels/>
    ContentPage.BindingContext>
    <ContentPage.Content>
        <StackLayout>
            <Frame BackgroundColor="#2196F3" Padding="24" CornerRadius="0">
                <Label Text="刘毅鹏平板demo" HorizontalTextAlignment="left" TextColor="White" FontSize="36"/>
            Frame>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="*"/>
                Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="*"/>
                Grid.ColumnDefinitions>
                    <FlexLayout  VerticalOptions="Center" HeightRequest="60" HorizontalOptions="Center" Grid.Row="0" Grid.Column="1" JustifyContent="SpaceEvenly" AlignItems="Center">
                        <Label Text="IP地址:" Padding="10,10,10,10" >Label>
                        <control:BorderlessEntry Text="{Binding IPAddress}" TextColor="Black" WidthRequest="200" FontSize="16" PlaceholderColor="LightGray" Placeholder="请输入IP地址">control:BorderlessEntry>
                    FlexLayout>
                <FlexLayout  Grid.Row="1"  HeightRequest="60" HorizontalOptions="Center"  Grid.Column="1" JustifyContent="SpaceEvenly" AlignItems="Center">
                    <Label Text="端口:" Padding="10,10,10,10" >Label>
                    <control:BorderlessEntry Text="{Binding Port}" TextColor="Black" WidthRequest="200"  FontSize="16" PlaceholderColor="LightGray" Placeholder="请输入端口">control:BorderlessEntry>
                FlexLayout>
                <Button Grid.Row="2"
                        Grid.Column="1"
                        Grid.ColumnSpan="1"
                        Margin="0,50,0,0" 
                        BorderWidth="1" 
                        TextColor="White" 
                        HeightRequest="50"  
                        Text="设置" 
                        BackgroundColor="#2296F3"
                        Command="{Binding SettingCommand}"
                        />

            Grid>
        StackLayout>
    ContentPage.Content>
ContentPage>

第四步:实现效果

Xamarin.Form中使用自定义Entry输入框(只有Android)_第2张图片
目的:自定义android输入框,样式可通过BorderlessEntryRenderer进行自定义修改

如有问题,私信交流,共勉

你可能感兴趣的:(问题心得,基本操作,xamarin,android,xml,c#,后端,xamarin)