Angolo arrotondato per la visualizzazione del testo in Android


171

Ho una visualizzazione testuale e voglio che il suo angolo sia di forma rotonda. So già che si può fare usando android:background="@drawable/somefile". Nel mio caso, questo tag è già incluso, quindi non è possibile utilizzarlo di nuovo. ad es. android:background="@drawable/mydialogbox"è già lì per creare un'immagine in background

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="fill_parent"
    android:layout_gravity="top"
    android:background="@drawable/mydialogbox"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/textview_name"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true" />

    </LinearLayout>

</RelativeLayout>

quindi quando voglio textview(textview_name)anche con l'angolo arrotondato, come questo può essere raggiunto.


4
se hai ricevuto la tua risposta piuttosto che accettare la risposta in modo che altri possano ottenere aiuto dal tuo contributo
MilapTank

Risposte:


438

1) Crea rounded_corner.xmlnella drawablecartella e aggiungi il seguente contenuto,

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >         
   <stroke
          android:width="1dp"
          android:color="@color/common_border_color" />

   <solid android:color="#ffffff" />

   <padding
           android:left="1dp"
           android:right="1dp"
           android:bottom="1dp"
           android:top="1dp" />

   <corners android:radius="5dp" />
</shape>

2) Imposta questo disegno nella TextViewproprietà background.per esempio:

android:background="@drawable/rounded_corner"

Spero che questo ti sia utile.


16
La risposta è corretta solo che il ragazzo che ha pubblicato non l'ha spiegato in dettaglio. Devi creare un xml [ad es. arrotondati_view.xml] nella tua cartella disegnabile con il codice sopra. E nel tuo layout che circonda la tua visualizzazione di testo metti questo come parametro android: background = "@ drawable / round_view"
Sharjeel Ahmed

4
android: background = "@ drawable / round_corner" non usa l'estensione qui!
Boris Gafurov,

4
Aggiungi android:shape="rectangle"se non ha funzionato per te
kristyna,

E ricostruisci il tuo progetto se non funzionasse automaticamente
adek111

18

Accanto radius, ci sono alcune proprietà di angolo rotondo come topRightRadius, topLeftRadius, bottomRightRadius,bottomLeftRadius

Esempio TextViewcon redbordo with corner andsfondo gray`

bg_rounded.xml

<shape xmlns:android="http://schemas.android.com/apk/res/android">
    <stroke
        android:width="10dp"
        android:color="#f00" />

    <solid android:color="#aaa" />

    <corners
        android:radius="5dp"
        android:topRightRadius="100dp" />
</shape>

TextView

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@drawable/bg_rounded"
    android:text="Text"
    android:padding="20dp"
    android:layout_margin="10dp"
    />

Risultato

inserisci qui la descrizione dell'immagine


16

Poiché la vista di livello superiore ha già Android: set di proprietà di sfondo, è possibile utilizzare un <layer-list>( collegamento ) per creare un nuovo disegno XML che combina sia il vecchio sfondo che il nuovo sfondo degli angoli arrotondati.

Ogni <item>elemento nell'elenco è disegnato sopra il successivo, quindi l'ultimo elemento nell'elenco è quello che finisce in cima.

<?xml version="1.0" encoding="utf-8"?>
<layer-list
    xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <bitmap android:src="@drawable/mydialogbox" />
    </item>
    <item>
        <shape>
            <stroke
                android:width="1dp"
                android:color="@color/common_border_color" />

            <solid android:color="#ffffff" />

            <padding
                    android:left="1dp"
                    android:right="1dp"
                    android:top="1dp" />

            <corners android:radius="5dp" />
        </shape>
    </item>
</layer-list>

6

crea un file xml gradient.xml nella cartella drawable

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle"  >
            <corners android:radius="50dip" />
            <stroke android:width="1dip" android:color="#667162" />
            <gradient android:angle="-90" android:startColor="#ffffff" android:endColor="#ffffff" />
        </shape>
    </item>
</selector>

quindi aggiungilo a TextView

android:background="@drawable/gradient"

6
  1. Fare clic con il tasto destro su Cartella Disegnabile e creare un nuovo file
  2. Assegna un nome al file secondo te e aggiungi l'estensione come .xml .
  3. Aggiungi il seguente codice nel file
  <?xml version="1.0" encoding="utf-8"?>
  <shape xmlns:android="http://schemas.android.com/apk/res/android"
      android:shape="rectangle">
      <corners android:radius="5dp" />
      <stroke android:width="1dp"  />
      <solid android:color="#1e90ff" />
  </shape>
  1. Aggiungi la linea in cui vuoi il bordo arrotondato android:background="@drawable/corner"

4

È possibile utilizzare la forma rettangolare fornita (senza gradiente, a meno che non si desideri) come segue:

In drawable/rounded_rectangle.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:radius="5dp" />
    <stroke android:width="1dp" android:color="#ff0000" />
    <solid android:color="#00ff00" />
</shape>

Quindi nella visualizzazione del testo:

android:background="@drawable/rounded_rectangle"

Naturalmente, vorrai personalizzare le dimensioni e i colori.


4

Ci sono due passaggi

1) Crea questo file nella tua cartella disegnabile: - rounded_corner.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
         <corners android:radius="10dp" />  // set radius of corner
         <stroke android:width="2dp" android:color="#ff3478" /> // set color and width of border
         <solid android:color="#FFFFFF" /> // inner bgcolor
</shape>

2) Impostare questo file nella TextViewproprietà come sfondo.

android:background="@drawable/rounded_corner"

Puoi usare questo disegno anche in Button o Edittext


3
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:id="@android:id/background">
        <shape>
            <corners android:radius="5dp" />
            <solid android:color="#ffffff"/>

        </shape>
    </item>
</layer-list>

3

Con la libreria dei componenti materiali è possibile utilizzare MaterialShapeDrawable.

Con un TextView:

    <TextView
        android:id="@+id/textview"
        ../>

È possibile applicare a livello di codice un MaterialShapeDrawable:

float radius = getResources().getDimension(R.dimen.corner_radius);

TextView textView = findViewById(R.id.textview);
ShapeAppearanceModel shapeAppearanceModel = new ShapeAppearanceModel()
        .toBuilder()
        .setAllCorners(CornerFamily.ROUNDED,radius)
        .build();

MaterialShapeDrawable shapeDrawable = new MaterialShapeDrawable(shapeAppearanceModel);
ViewCompat.setBackground(textView,shapeDrawable);

inserisci qui la descrizione dell'immagine

Se vuoi cambiare il colore di sfondo e il bordo è sufficiente applicare:

shapeDrawable.setFillColor(ContextCompat.getColorStateList(this,R.color.....));
shapeDrawable.setStroke(2.0f, ContextCompat.getColor(this,R.color....));

0

È possibile utilizzare SVG per arrotondare gli angoli e caricare in ImageView e utilizzare ConstraintLayout per portare ImageView su TextView

L'ho usato per ImageView arrotondato e TextView arrotondato


0

Basta usare un'immagine ad angolo arrotondato come sfondo di quella vista per renderlo tale.

android:background="@drawable/my_custom_image"
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.