Fond rectangle arrondi editext avec indice en haut à gauche de la bordure d'arrière-plan

Question

Je me suis retrouvé coincé dans la création de l'interface utilisateur. aidez-moi s'il vous plaît à créer cela.

J'ai un EditText avec une bordure de rectangle arrondie, ce qui est correct, mais l'espace réservé est dans le haut de la bordure qui quitte la bordure.

est ici l'image

Merci à l'avance.

Answer 1

Vous devez utiliser Vector Drawable pour créer une forme personnalisée que vous avez besoin.

J'ai créé un échantillon pour le même. Créer custom_vector.xml fichier sous res/drawable/

<vector xmlns:android="http://schemas.android.com/apk/res/android" 
    android:height="20dp" 
    android:width="20dp" 
    android:viewportWidth="400" 
    android:viewportHeight="400"> 

    <group 
     android:pivotX="10.0" 
     android:pivotY="10.0"> 

     <!-- the outside box --> 

     <!-- top line & top left corner --> 
     <path android:pathData="M 30 60 H 40 c -40 0 -35 0 -35 35 " 
      android:strokeColor="#000000" android:strokeWidth="10" /> 

     <!-- left line & bottom left corner --> 
     <path android:pathData="M 5 64 v 271 c 0 40 0 35 35 35 " 
      android:strokeColor="#000000" android:strokeWidth="10" /> 

     <!-- bottom line & bottom right corner --> 
     <path android:pathData="M 30 370 h 330 c 40 0 35 -10 35 -35" 
      android:strokeColor="#000000" android:strokeWidth="10" /> 

     <!-- right line & top right corner --> 
     <path android:pathData="M 395 356 v -261 c0 -40 0 -35 -50 -35" 
      android:strokeColor="#000000" android:strokeWidth="10" /> 

     <!-- top line till end--> 
     <!-- 140 is the starting point of line after TEXT--> 
     <path android:pathData="M 140 60 370 60" 
      android:strokeColor="#000000" android:strokeWidth="10" /> 
    </group> 
</vector> 

Vous pourriez avoir à modifier la valeur de la balise dernière chemin

première ligne jusqu'à la fin

comme par votre texte à l'adresse 'Nom'. Vous pouvez également modifier la forme ou les coins comme vous le souhaitez.

Créez un fichier de test_layout.xml sous res/layout/

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:background="#faffd5"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:background="@drawable/custom_vector" 
     android:layout_margin="20dp" 
     android:orientation="vertical"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_marginLeft="40dp" 
      android:paddingLeft="5dp" 
      android:textSize="20sp" 
      android:paddingRight="5dp" 
      android:text="Name"/> 

     <EditText 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:layout_marginLeft="40dp" 
      android:layout_marginRight="20dp" 
      android:layout_marginBottom="15dp" 
      android:textSize="25sp" 
      android:background="@android:color/transparent" 
      android:text="Alex Smith"/> 

    </LinearLayout> 
</LinearLayout> 

Il apparaît comme cette capture d'écran

Answer 2

essayer ci-dessous ...

vous cela en utilisant ConstraintLayout atteindre.

<?xml version="1.0" encoding="utf-8"?> 
<android.support.constraint.ConstraintLayout 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:id="@+id/linearLayout" 
    android:layout_width="match_parent" 
    android:background="@android:color/white" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 

    <EditText 
     android:id="@+id/edittext" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_margin="@dimen/_10sdp" 
     android:layout_marginBottom="8dp" 
     android:layout_marginEnd="8dp" 
     android:layout_marginStart="8dp" 
     android:layout_marginTop="8dp" 
     android:background="@drawable/round" 
     android:padding="@dimen/_10sdp" 
     app:layout_constraintBottom_toBottomOf="parent" 
     app:layout_constraintEnd_toEndOf="parent" 
     app:layout_constraintStart_toStartOf="parent" 
     app:layout_constraintTop_toTopOf="parent" /> 

    <TextView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="@android:color/white" 
     android:padding="@dimen/_5sdp" 
     android:text="Name" 
     app:layout_constraintLeft_toLeftOf="@+id/edittext" 
     android:layout_marginLeft="@dimen/_15sdp" 
     app:layout_constraintTop_toTopOf="@+id/edittext" 
     app:layout_constraintBottom_toTopOf="@+id/edittext" 
     android:textColor="@android:color/black" 
     tools:layout_editor_absoluteX="107dp" 
     tools:layout_editor_absoluteY="90dp" /> 
</android.support.constraint.ConstraintLayout> 

round.xml

<?xml version="1.0" encoding="utf-8"?> 
<!-- res/drawable/rounded_edittext.xml --> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle" android:padding="10dp"> 
    <solid android:color="#FFFFFF"/> 
    <stroke android:color="@android:color/darker_gray" android:width="@dimen/_1sdp"/> 
    <corners 
     android:bottomRightRadius="15dp" 
     android:bottomLeftRadius="15dp" 
     android:topLeftRadius="15dp" 
     android:topRightRadius="15dp"/> 
</shape> 

Sortie: see