Comment mettre une bordure autour d'une vue de texte Android?

Est-il possible de tracer une bordure autour d'une vue de texte?

Vous pouvez définir une forme dessinable (un rectangle) comme arrière-plan pour la vue.

<TextView android:text="Some text" android:background="@drawable/back"/>

Et rectangle drawable back.xml (placé dans le dossier res / drawable):

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
   <solid android:color="@android:color/white" />
   <stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>

Vous pouvez utiliser @android:color/transparentpour que la couleur unie ait un arrière-plan transparent. Vous pouvez également utiliser un remplissage pour séparer le texte de la bordure. pour plus d'informations, voir: http://developer.android.com/guide/topics/resources/drawable-resource.html

Permettez-moi de résumer quelques méthodes différentes (non programmatiques).

Utilisation d'une forme dessinable

Enregistrez les éléments suivants en tant que fichier XML dans votre dossier dessinable (par exemple, my_border.xml):

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

    <!-- View background color -->
    <solid
        android:color="@color/background_color" >
    </solid>

    <!-- View border color and width -->
    <stroke
        android:width="1dp"
        android:color="@color/border_color" >
    </stroke>

    <!-- The radius makes the corners rounded -->
    <corners
        android:radius="2dp"   >
    </corners>

</shape>

Ensuite, définissez-le simplement comme arrière-plan de votre TextView:

<TextView
    android:id="@+id/textview1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/my_border" />

Plus d'aide:

• Shape Drawable (documents Android)
• Trucs et astuces pour les développeurs Android: XML Drawables (Partie I)

Utilisation d'un patch 9

Un patch 9 est une image de fond extensible. Si vous créez une image avec une bordure, cela donnera à votre TextView une bordure. Tout ce que vous avez à faire est de créer l'image, puis de la placer en arrière-plan dans votre TextView.

<TextView
    android:id="@+id/textview1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/my_ninepatch_image" />

Voici quelques liens qui montreront comment créer une image à 9 patchs:

• Dessiner 9 patchs
• Générateur simple à neuf patchs
• Un guide simple pour 9 patchs pour l'interface utilisateur Android
• Création et utilisation d'images à 9 patchs sur Android

Et si je veux juste la bordure supérieure?

Utilisation d'une liste de couches

Vous pouvez utiliser une liste de calques pour empiler deux rectangles l'un sur l'autre. En rendant le deuxième rectangle un peu plus petit que le premier rectangle, vous pouvez créer un effet de bordure. Le premier rectangle (inférieur) est la couleur de la bordure et le deuxième rectangle est la couleur d'arrière-plan.

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

    <!-- Lower rectangle (border color) -->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@color/border_color" />
        </shape>
    </item>

    <!-- Upper rectangle (background color) -->
    <item android:top="2dp">
        <shape android:shape="rectangle">
            <solid android:color="@color/background_color" />
        </shape>
    </item>
</layer-list>

Le réglage android:top="2dp"décale le haut (le rend plus petit) de 2dp. Cela permet au premier rectangle (inférieur) de transparaître, donnant un effet de bordure. Vous pouvez appliquer cela à l'arrière-plan TextView de la même manière que leshape dessinable a été effectué ci-dessus.

Voici quelques liens supplémentaires sur les listes de couches:

• Comprendre la <layer-list> d'Android
• Comment faire une bordure inférieure dans un sélecteur XML de forme dessinable?
• Créer des bordures sur une vue Android en XML dessinable, sur 3 côtés?

Utilisation d'un patch 9

Vous pouvez simplement créer une image à 9 patchs avec une seule bordure. Tout le reste est le même que celui discuté ci-dessus.

Utilisation d'une vue

C'est une sorte d'astuce, mais cela fonctionne bien si vous devez ajouter un séparateur entre deux vues ou une bordure à une seule TextView.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/textview1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <!-- This adds a border between the TextViews -->
    <View
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:background="@android:color/black" />

    <TextView
        android:id="@+id/textview2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</LinearLayout>

Voici quelques liens supplémentaires:

• Comment tracer une ligne dans Android
• Comment mettre une ligne de séparation horizontale entre modifier le texte dans une activité
• Comment ajouter une ligne horizontale 1px au-dessus de la vue d'image dans une disposition relative?

Le moyen le plus simple consiste à ajouter une vue pour votre TextView. Exemple pour la ligne de bordure inférieure:

<LinearLayout android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent">
    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_marginLeft="10dp"
        android:text="@string/title"
        android:id="@+id/title_label"
        android:gravity="center_vertical"/>
    <View
        android:layout_width="fill_parent"
        android:layout_height="0.2dp"
        android:id="@+id/separator"
        android:visibility="visible"
        android:background="@android:color/darker_gray"/>

</LinearLayout>

Pour les autres bordures de direction, veuillez ajuster l'emplacement de la vue de séparation.

J'ai résolu ce problème en étendant la vue de texte et en dessinant une bordure manuellement. J'ai même ajouté pour que vous puissiez sélectionner si une bordure est en pointillés ou en pointillés.

public class BorderedTextView extends TextView {
        private Paint paint = new Paint();
        public static final int BORDER_TOP = 0x00000001;
        public static final int BORDER_RIGHT = 0x00000002;
        public static final int BORDER_BOTTOM = 0x00000004;
        public static final int BORDER_LEFT = 0x00000008;

        private Border[] borders;

        public BorderedTextView(Context context, AttributeSet attrs, int defStyle) {
            super(context, attrs, defStyle);
            init();
        }

        public BorderedTextView(Context context, AttributeSet attrs) {
            super(context, attrs);
            init();
        }

        public BorderedTextView(Context context) {
            super(context);
            init();
        }
        private void init(){
            paint.setStyle(Paint.Style.STROKE);
            paint.setColor(Color.BLACK);
            paint.setStrokeWidth(4);        
        }
        @Override
        protected void onDraw(Canvas canvas) {
            super.onDraw(canvas);
            if(borders == null) return;

            for(Border border : borders){
                paint.setColor(border.getColor());
                paint.setStrokeWidth(border.getWidth());

                if(border.getStyle() == BORDER_TOP){
                    canvas.drawLine(0, 0, getWidth(), 0, paint);                
                } else
                if(border.getStyle() == BORDER_RIGHT){
                    canvas.drawLine(getWidth(), 0, getWidth(), getHeight(), paint);
                } else
                if(border.getStyle() == BORDER_BOTTOM){
                    canvas.drawLine(0, getHeight(), getWidth(), getHeight(), paint);
                } else
                if(border.getStyle() == BORDER_LEFT){
                    canvas.drawLine(0, 0, 0, getHeight(), paint);
                }
            }
        }

        public Border[] getBorders() {
            return borders;
        }

        public void setBorders(Border[] borders) {
            this.borders = borders;
        }
}

Et la classe frontière:

public class Border {
    private int orientation;
    private int width;
    private int color = Color.BLACK;
    private int style;
    public int getWidth() {
        return width;
    }
    public void setWidth(int width) {
        this.width = width;
    }
    public int getColor() {
        return color;
    }
    public void setColor(int color) {
        this.color = color;
    }
    public int getStyle() {
        return style;
    }
    public void setStyle(int style) {
        this.style = style;
    }
    public int getOrientation() {
        return orientation;
    }
    public void setOrientation(int orientation) {
        this.orientation = orientation;
    }
    public Border(int Style) {
        this.style = Style;
    }
}

J'espère que cela aide quelqu'un :)

Je cherchais juste une réponse similaire - cela peut être fait avec un coup et le remplacement suivant:

@Override
public void draw(Canvas canvas, MapView mapView, boolean shadow) {

Paint strokePaint = new Paint();
strokePaint.setARGB(255, 0, 0, 0);
strokePaint.setTextAlign(Paint.Align.CENTER);
strokePaint.setTextSize(16);
strokePaint.setTypeface(Typeface.DEFAULT_BOLD);
strokePaint.setStyle(Paint.Style.STROKE);
strokePaint.setStrokeWidth(2);

Paint textPaint = new Paint();
textPaint.setARGB(255, 255, 255, 255);
textPaint.setTextAlign(Paint.Align.CENTER);
textPaint.setTextSize(16);
textPaint.setTypeface(Typeface.DEFAULT_BOLD);

canvas.drawText("Some Text", 100, 100, strokePaint);
canvas.drawText("Some Text", 100, 100, textPaint);

super.draw(canvas, mapView, shadow); 
}

Vous pouvez définir la bordure par deux méthodes. L'un est par tirage et le second est programmatique.

Utilisation de Drawable

<shape>
    <solid android:color="@color/txt_white"/>
    <stroke android:width="1dip" android:color="@color/border_gray"/>
    <corners android:bottomLeftRadius="10dp"
             android:bottomRightRadius="0dp"
             android:topLeftRadius="10dp"
             android:topRightRadius="0dp"/>
    <padding android:bottom="0dip"
             android:left="0dip"
             android:right="0dip"
             android:top="0dip"/>
</shape>

Programmatique

public static GradientDrawable backgroundWithoutBorder(int color) {

    GradientDrawable gdDefault = new GradientDrawable();
    gdDefault.setColor(color);
    gdDefault.setCornerRadii(new float[] { radius, radius, 0, 0, 0, 0,
                                           radius, radius });
    return gdDefault;
}

La solution la plus simple que j'ai trouvée (et qui fonctionne réellement):

<TextView
    ...
    android:background="@android:drawable/editbox_background" />

J'ai trouvé un meilleur moyen de mettre une bordure autour d'un TextView.

Utilisez une image à neuf patchs pour l'arrière-plan. C'est assez simple, le SDK est livré avec un outil pour créer l'image à 9 patchs, et il n'implique absolument aucun codage.

Le lien est http://developer.android.com/guide/topics/graphics/2d-graphics.html#nine-patch .

Vous pouvez ajouter quelque chose comme ça dans votre code:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle" >
    <solid android:color="#ffffff" />
    <stroke android:width="1dip" android:color="#4fa5d5"/>
</shape>

Vérifiez le lien ci-dessous pour faire des coins arrondis http://androidcookbook.com/Recipe.seam?recipeId=2318

Le dossier dessinable, sous res, dans un projet Android n'est pas limité aux bitmaps (fichiers PNG ou JPG), mais il peut également contenir des formes définies dans des fichiers XML.

Ces formes peuvent ensuite être réutilisées dans le projet. Une forme peut être utilisée pour placer une bordure autour d'une disposition. Cet exemple montre une bordure rectangulaire avec des coins incurvés. Un nouveau fichier appelé customborder.xml est créé dans le dossier dessinable (dans Eclipse, utilisez le menu Fichier et sélectionnez Nouveau puis Fichier, avec le dossier dessinable sélectionné, tapez le nom du fichier et cliquez sur Terminer).

Le XML définissant la forme de la bordure est entré:

<?xml version="1.0" encoding="UTF-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
    <corners android:radius="20dp"/>
    <padding android:left="10dp" android:right="10dp" android:top="10dp" android:bottom="10dp"/>
    <solid android:color="#CCCCCC"/>
</shape>

L'attribut android:shapeest défini sur rectangle (les fichiers de forme prennent également en charge ovale, ligne et anneau). Le rectangle est la valeur par défaut, donc cet attribut peut être omis s'il s'agit d'un rectangle en cours de définition. Voir la documentation Android sur les formes à http://developer.android.com/guide/topics/resources/drawable-resource.html#Shape pour des informations détaillées sur un fichier de forme.

Les coins des éléments définissent les coins du rectangle à arrondir. Il est possible de définir un rayon différent sur chaque coin (voir la référence Android).

Les attributs de remplissage sont utilisés pour déplacer le contenu de la vue à laquelle la forme est appliquée, pour éviter que le contenu ne chevauche la bordure.

Ici, la couleur de la bordure est définie sur un gris clair (valeur RVB hexadécimale).

Les formes prennent également en charge les dégradés, mais cela n'est pas utilisé ici. Encore une fois, consultez les ressources Android pour voir comment un dégradé est défini. La forme est appliquée au laypout en utilisantandroid:background="@drawable/customborder" .

Dans la mise en page, d'autres vues peuvent être ajoutées normalement. Dans cet exemple, une seule TextView a été ajoutée et le texte est blanc (FFFFFF RVB hexadécimal). L'arrière-plan est bleu, plus une certaine transparence pour réduire la luminosité (valeur alpha RGB hexadécimale A00000FF). Enfin, la disposition est décalée du bord de l'écran en la plaçant dans une autre disposition avec une petite quantité de rembourrage. Le fichier de mise en page complet est donc:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent"
              android:padding="5dp">
    <LinearLayout android:orientation="vertical"
                  android:layout_width="fill_parent"
                  android:layout_height="fill_parent"
                  android:background="@drawable/customborder">
        <TextView android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:text="Text View"
                android:textSize="20dp"
                android:textColor="#FFFFFF"
                android:gravity="center_horizontal"
                android:background="#A00000FF" />
    </LinearLayout>
</LinearLayout>

J'ai un moyen de le faire très simplement et j'aimerais le partager.

Lorsque je veux mettre des TextViews au carré, je les mets simplement dans un LinearLayout. J'ai défini la couleur d'arrière-plan de mon LinearLayout et j'ajoute une marge à mon TextView. Le résultat est exactement comme si vous cadriez le TextView.

Changer la réponse de Konstantin Burov car cela ne fonctionne pas dans mon cas:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white" />
            <stroke android:width="2dip" android:color="#4fa5d5"/>
            <corners android:radius="7dp"/>
        </shape>
    </item>
</selector>

compileSdkVersion 26 (Android 8.0), minSdkVersion 21 (Android 5.0), targetSdkVersion 26, implémentation 'com.android.support:appcompat-v7:26.1.0', gradle: 4.1

Vous pouvez créer un arrière-plan personnalisé pour votre affichage de texte. Étapes 1. Accédez à votre projet. 2. Allez dans les ressources et faites un clic droit pour dessiner. 3. Cliquez sur Nouveau -> Fichier de ressources dessinable 4. Donnez un nom à votre fichier 5. Collez le code suivant dans le fichier

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:width="1dp" android:color="@color/colorBlack" />
<padding android:left="1dp"
    android:top="1dp"
    android:right="1dp"
    android:bottom="1dp" />
<corners android:radius="6dp" />
<solid android:color="#ffffffff" />

6. Pour afficher votre texte là où vous souhaitez l'utiliser comme arrière-plan,

   android: background = "@ drawable / your_fileName"

Voici ma classe d'aide «simple» qui renvoie une ImageView avec la bordure. Déposez simplement ceci dans votre dossier utils, et appelez-le comme ceci:

ImageView selectionBorder = BorderDrawer.generateBorderImageView(context, borderWidth, borderHeight, thickness, Color.Blue);

Voici le code.

/**
 * Because creating a border is Rocket Science in Android.
 */
public class BorderDrawer
{
    public static ImageView generateBorderImageView(Context context, int borderWidth, int borderHeight, int borderThickness, int color)
    {
        ImageView mask = new ImageView(context);

        // Create the square to serve as the mask
        Bitmap squareMask = Bitmap.createBitmap(borderWidth - (borderThickness*2), borderHeight - (borderThickness*2), Bitmap.Config.ARGB_8888);
        Canvas canvas = new Canvas(squareMask);

        Paint paint = new Paint();
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(color);
        canvas.drawRect(0.0f, 0.0f, (float)borderWidth, (float)borderHeight, paint);

        // Create the darkness bitmap
        Bitmap solidColor = Bitmap.createBitmap(borderWidth, borderHeight, Bitmap.Config.ARGB_8888);
        canvas = new Canvas(solidColor);

        paint.setStyle(Paint.Style.FILL);
        paint.setColor(color);
        canvas.drawRect(0.0f, 0.0f, borderWidth, borderHeight, paint);

        // Create the masked version of the darknessView
        Bitmap borderBitmap = Bitmap.createBitmap(borderWidth, borderHeight, Bitmap.Config.ARGB_8888);
        canvas = new Canvas(borderBitmap);

        Paint clearPaint = new Paint();
        clearPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));

        canvas.drawBitmap(solidColor, 0, 0, null);
        canvas.drawBitmap(squareMask, borderThickness, borderThickness, clearPaint);

        clearPaint.setXfermode(null);

        ImageView borderView = new ImageView(context);
        borderView.setImageBitmap(borderBitmap);

        return borderView;
    }
}

Cela peut vous aider.

<RelativeLayout
    android:id="@+id/textbox"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:background="@android:color/darker_gray" >

    <TextView
        android:id="@+id/text"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:layout_margin="3dp"
        android:background="@android:color/white"
        android:gravity="center"
        android:text="@string/app_name"
        android:textSize="20dp" />

</RelativeLayout

Créez une vue de bordure avec la couleur d'arrière-plan comme couleur de la bordure et la taille de votre vue de texte. définissez le remplissage de la vue de bordure comme la largeur de la bordure. Définissez la couleur d'arrière-plan de la vue texte comme la couleur souhaitée pour la vue texte. Ajoutez maintenant votre vue texte à l'intérieur de la vue de bordure.

Essaye ça:

<shape>
    <solid android:color="@color/txt_white"/>
    <stroke android:width="1dip" android:color="@color/border_black"/>
</shape>

Il existe de nombreuses façons d'ajouter une bordure à un textView. La plus simple consiste à créer un dessin personnalisé et à le définir comme android:background="@drawable/textview_bg"pour votre TextView.

Le textview_bg.xml ira sous Drawables et peut être quelque chose comme ça. Vous pouvez avoir un solidou un gradientarrière - plan (ou rien si non requis), cornerspour ajouter un rayon de coin etstroke pour ajouter une bordure.

textview_bg.xml

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

        <corners
            android:radius="@dimen/dp_10"/>

        <gradient
            android:angle="225"
            android:endColor="#FFFFFF"
            android:startColor="#E0E0E0" />

        <stroke
            android:width="2dp"
            android:color="#000000"/>

    </shape>

  <View
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="@android:color/black" />

ce code assez vous pouvez placer où vous voulez

setBackground sur votre textview xml,

ajoutez le fichier arrondi_texteview.xml dans votre répertoire dessinable.

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
   <solid android:color="@android:color/white" />
   <stroke android:width="2dip" android:color="#4f5g52"/>
</shape>

définir un fichier dessinable en arrière-plan textView.

En fait, c'est très simple. Si vous voulez un simple rectangle noir derrière le Textview, ajoutez simplement android:background="@android:color/black"dans les balises TextView. Comme ça:

<TextView
    android:textSize="15pt" android:textColor="#ffa7ff04"
    android:layout_alignBottom="@+id/webView1"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:background="@android:color/black"/>