How to Create Outlined EditText in Xamarin Android

I need to design a EditText with Outlined Label like below image.

Answers

  • Luis_dmLuis_dm USMember ✭✭✭
    edited April 17

    You can use this:

        <android.support.design.widget.TextInputLayout
          android:layout_width="match_parent"
           android:layout_height="wrap_content">    
    
            <EditText android:id="@+id/editttext"
            android:layout_width = "match_parent"
            android:layout_height="50dp"
            android:fontFamily="sans-serif-condensed"              
            android:hint="Label"
            android:inputType="textNoSuggestions|textCapSentences"/>    
      </android.support.design.widget.TextInputLayout>
    
  • JarvanJarvan Member, Xamarin Team Xamurai
    edited April 18

    @Mohanasundharam
    1. The style is not introduced in 27.0.2, update Xamarin.Android.Support.Design nuget package version to 28.0.0.1.
    2. Change the project Target Framework to Android 9.0

  • JarvanJarvan Member, Xamarin Team Xamurai

    You can refer to the following code

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    
            <android.support.design.widget.TextInputLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox">
                <EditText
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:hint="Label"/>
            </android.support.design.widget.TextInputLayout>
    
    </LinearLayout>
    

Sign In or Register to comment.