Android Ajout d'attributs à des vues


Exemple

Les vues personnalisées peuvent également prendre des attributs personnalisés pouvant être utilisés dans les fichiers de ressources de présentation Android. Pour ajouter des attributs à votre vue personnalisée, procédez comme suit:

  1. Définissez le nom et le type de vos attributs: cela se fait à l'intérieur de res/values/attrs.xml (créez-le si nécessaire). Le fichier suivant définit un attribut de couleur pour la couleur du visage de notre smiley et un attribut enum pour l'expression du smiley:

    <resources>
        <declare-styleable name="SmileyView">
            <attr name="smileyColor" format="color" />
            <attr name="smileyExpression" format="enum">
                <enum name="happy" value="0"/>
                <enum name="sad" value="1"/>
            </attr>
        </declare-styleable>
        <!-- attributes for other views -->
    </resources>
    
  2. Utilisez vos attributs dans votre mise en page: cela peut être fait à l'intérieur de tous les fichiers de mise en page qui utilisent votre vue personnalisée. Le fichier de mise en page suivant crée un écran avec un smiley jaune heureux:

    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_height="match_parent"
        android:layout_width="match_parent">
        
        <com.example.app.SmileyView
            android:layout_height="56dp"
            android:layout_width="56dp"
            app:smileyColor="#ffff00"
            app:smileyExpression="happy" />
    </FrameLayout>
    

    Conseil: Les attributs personnalisés ne fonctionnent pas avec les tools: préfixe dans Android Studio 2.1 et versions antérieures (et éventuellement dans les futures versions). Dans cet exemple, en remplaçant app:smileyColor par des tools:smileyColor smileyColor être défini pendant l'exécution ou au moment du design.

  3. Lisez vos attributs: cela se fait à l'intérieur du code source de votre vue personnalisée. L'extrait suivant de SmileyView montre comment les attributs peuvent être extraits:

    public class SmileyView extends View {
        // ...
    
        public SmileyView(Context context) {
            this(context, null);
        }
    
        public SmileyView(Context context, AttributeSet attrs) {
            this(context, attrs, 0);
        }
    
        public SmileyView(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
            
            TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.SmileyView, defStyleAttr, 0);
            mFaceColor = a.getColor(R.styleable.SmileyView_smileyColor, Color.TRANSPARENT);
            mFaceExpression = a.getInteger(R.styleable.SmileyView_smileyExpression, Expression.HAPPY);
            // Important: always recycle the TypedArray
            a.recycle();
    
            // initPaints(); ...
        }
    }
    
  4. (Facultatif) Ajoutez le style par défaut: pour ce faire, ajoutez un style avec les valeurs par défaut et chargez-le dans votre vue personnalisée. Le style smiley par défaut suivant représente un style jaune heureux:

    <!-- styles.xml -->
    <style name="DefaultSmileyStyle">
        <item name="smileyColor">#ffff00</item>
        <item name="smileyExpression">happy</item>
    </style>
    

    Ce qui est appliqué dans notre SmileyView en l’ajoutant comme dernier paramètre de l’appel à obtainStyledAttributes (voir le code à l’étape 3):

    TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.SmileyView, defStyleAttr, R.style.DefaultSmileyViewStyle);
    

    Notez que toute valeur d'attribut définie dans le fichier de mise en forme gonflé (voir le code à l'étape 2) remplacera les valeurs correspondantes du style par défaut.

  5. (Facultatif) Fournissez des styles à l'intérieur des thèmes: cela se fait en ajoutant un nouvel attribut de référence de style qui peut être utilisé dans vos thèmes et en fournissant un style pour cet attribut. Ici, nous smileyStyle simplement notre attribut de référence smileyStyle :

    <!-- attrs.xml -->
    <attr name="smileyStyle" format="reference" />
    

    Nous fournissons ensuite un style dans notre thème d'application (ici, nous réutilisons simplement le style par défaut de l'étape 4):

    <!-- themes.xml -->
    <style name="AppTheme" parent="AppBaseTheme">
        <item name="smileyStyle">@style/DefaultSmileyStyle</item>
    </style>