Définition de la couleur d'arrière-plan de l'élément de mise en page Android

198

J'essaie de cloner quelque peu la conception d'une activité à partir d'un ensemble de diapositives sur la conception de l'interface utilisateur Android . Cependant, j'ai un problème avec une tâche très simple.

J'ai créé la mise en page comme indiqué dans l'image, et l'en-tête est un TextViewdans un RelativeLayout. Maintenant, je souhaite changer la couleur d'arrière-plan du RelativeLayout, mais je n'arrive pas à comprendre comment.

Je sais que je peux définir la android:backgroundpropriété dans la RelativeLayoutbalise du fichier XML, mais à quoi dois-je la définir? Je veux définir une nouvelle couleur que je peux utiliser à plusieurs endroits. Est-ce un drawableou un string?

De plus, je m'attendrais à ce qu'il y ait un moyen très simple de le faire depuis le concepteur d'interface utilisateur Eclipse Android que je dois manquer?

Je suis un peu frustré actuellement, car cela devrait être une activité qui se fait en quelques clics au maximum. Donc, toute aide est très appréciée. :)

Conception d'activités Android

Bjarke Freund-Hansen
la source
28
quel logiciel avez-vous utilisé pour dessiner le graphique sur le côté droit?
lucas
8
@lucas: Je n'ai pas dessiné les diagrammes, comme je l'ai noté dans les questions, c'est à partir d'un ensemble de diapositives sur la conception de l'interface utilisateur Android. Voir le lien dans la question.
Bjarke Freund-Hansen

Réponses:

280

Vous pouvez utiliser des ressources de couleur simples , spécifiées généralement à l'intérieur res/values/colors.xml.

<color name="red">#ffff0000</color>

et l'utiliser via android:background="@color/red". Cette couleur peut également être utilisée ailleurs, par exemple comme couleur de texte. Référencez-le en XML de la même manière, ou récupérez-le dans le code via getResources().getColor(R.color.red).

Vous pouvez également utiliser n'importe quelle ressource dessinable comme arrière-plan, utilisez android:background="@drawable/mydrawable"-la (cela signifie que les tirages 9patch, les bitmaps normaux, les dessinables de forme, ..).


la source
6
Fonctionne comme un charme, merci. Pourriez-vous m'indiquer la référence où j'aurais dû lire ceci?
Bjarke Freund-Hansen
6
Euh en fait: Non. Je viens de chercher dans les documents, c'est un truc Android assez standard, mais cela ne semble nulle part vraiment documenté. Ni les didacticiels sur le site de développement ni les exemples d'api ne l'utilisent. Le doc Android fait quelque peu défaut en ce qui concerne certaines fonctionnalités. Je pense que je l'ai ramassé par accident dans certains tutoriels externes. Habituellement, c'est une bonne idée de parcourir les exemples d'api et les exemples de projets. Vous pouvez trouver le code dans le ANDROID_SDK\samplesdossier (pour différentes versions d'Android). L'ensemble de l'exemple d'application api est également préinstallé dans chaque instance d'émulateur.
2
J'ai également vérifié le concepteur d'interface utilisateur. Rien de facile à trouver. Mais je recommande quand même d'écrire les choses à la main dans le xml. Le designer s'est beaucoup amélioré récemment, mais il n'est toujours pas utilisable à mon avis. Non seulement certaines options sont limitées, mais la mise en page semble parfois complètement différente sur un appareil réel (en particulier lorsque vous utilisez des ressources dessinables référencées. Elles ne sont pas mises à l'échelle correctement ou ne sont même pas affichées du tout d'après mon expérience) . Testez vos dispositions sur votre appareil ou sur un émulateur.
1
pour certaines couleurs "par défaut", vous pouvez utiliser cette syntaxe: android: background = "@ android: color / white"
dalf
1
getResources (). getColor () est désormais obsolète.
Rohit Bandil
90

Les réponses ci-dessus sont agréables. Vous pouvez également procéder comme ceci par programme si vous le souhaitez

Tout d'abord, votre mise en page doit avoir un ID. Ajoutez-le en écrivant la +idligne suivante dans res / layout / *. Xml

<RelativeLayout ...
...
android:id="@+id/your_layout_id"
...
</RelativeLayout>

Ensuite, dans votre code Java, apportez les modifications suivantes.

RelativeLayout rl = (RelativeLayout)findViewById(R.id.your_layout_id);
rl.setBackgroundColor(Color.RED);

en dehors de cela, si vous avez la couleur définie dans colors.xml, vous pouvez également faire par programme:

rl.setBackgroundColor(ContextCompat.getColor(getContext(), R.color.red));
Android Killer
la source
24
Si vous le voulez dynamique, je pense que vous ne pouvez pas utiliser XML.
Guillermo Gutiérrez
1
+1 car je dois le modifier au moment de l'exécution en fonction de l'indicateur d'état; J'ai également pu récupérer la couleur d'origine en utilisant la constante Color.TRANSPARENT.
Zac
10
@ BjarkeFreund-Hansen Il reconnaît les autres réponses et fournit cette solution programmatique. Pas downvote digne.
Anubian Noob
4
@ BjarkeFreund-Hansen, la question est de savoir comment définir l'arrière-plan et non comment définir la couleur, lire correctement. Et si la question est là-dessus. Je le reconnais et j'ai dit "vous pouvez aussi faire comme" ... afin qu'il puisse y aller ou non. De plus, cela peut aider les autres comme vous l'avez déjà vu. peut tu ??
Android Killer
7
plus un juste pour compenser le moins de @ BjarkeFreund-Hansen
Rahul
42

Vous pouvez utiliser android:background="#DC143C"ou toute autre valeur RVB pour votre couleur. Je n'ai aucun problème à l'utiliser de cette façon, comme indiqué ici

yjw
la source
5
-1 parce que j'ai écrit explicitement "Je veux définir une nouvelle couleur que je peux utiliser à plusieurs endroits" dans la question, parce que je ne voulais pas coder en dur la valeur de la couleur, mais la définir comme une ressource que je peux utiliser à plusieurs endroits.
Bjarke Freund-Hansen
6
@GMsoF: Oh ça marche mais ça ne répond pas à la question.
Bjarke Freund-Hansen
21

le

res/values/colors.xml.

<color name="red">#ffff0000</color>
android:background="@color/red"

par exemple n'a pas fonctionné pour moi, mais le

android:background="#(hexidecimal here without these parenthesis)"

travaillé pour moi dans l'élément de mise en page relative en tant qu'attribut.

user2585548
la source
10
Avez-vous oublié d'envelopper la balise de couleur avec une balise de ressources?
elimirks
19

Si vous voulez changer une couleur rapidement (et que vous n'avez pas de numéros Hex mémorisés), Android a quelques couleurs prédéfinies auxquelles vous pouvez accéder comme ceci:

android:background="@android:color/black"

Vous pouvez choisir parmi 15 couleurs, ce qui est bien pour tester rapidement les choses, et vous n'avez pas besoin de configurer des fichiers supplémentaires.

La configuration d'un fichier values ​​/ colors.xml et l'utilisation de Hex droit comme expliqué ci-dessus fonctionneront toujours.

kgibilterra
la source
4

4 façons possibles, utilisez celle dont vous avez besoin.

1. Kotlin

val ll = findViewById<LinearLayout>(R.id.your_layout_id)
ll.setBackgroundColor(ContextCompat.getColor(this, R.color.white))

2. Liaison de données

<LinearLayout
    android:background="@{@color/white}"

OU déclaration plus utile-

<LinearLayout
    android:background="@{model.colorResId}"

3. XML

<LinearLayout
    android:background="#FFFFFF"

<LinearLayout
    android:background="@color/white"

4. Java

LinearLayout ll = (LinearLayout) findViewById(R.id.your_layout_id);
ll.setBackgroundColor(ContextCompat.getColor(this, R.color.white));
Khemraj
la source
2

Android studio 2.1.2 (ou peut-être plus tôt) vous permettra de choisir parmi une roue chromatique:

Roue chromatique dans Android Studio

J'ai obtenu cela en ajoutant ce qui suit à ma mise en page:

android:background="#FFFFFF"

Puis j'ai cliqué sur la couleur FFFFFF et cliqué sur l'ampoule qui est apparue.

Shygar
la source
1

Kotlin

linearLayout.setBackgroundColor(Color.rgb(0xf4,0x43,0x36))

ou

<color name="newColor">#f44336</color>

-

linearLayout.setBackgroundColor(ContextCompat.getColor(vista.context, R.color.newColor))
Bemtorres
la source
0

Les réponses sont avant tout statiques. Je pensais que je fournirais une réponse dynamique. Les deux fichiers qui devront être synchronisés sont le parent foo.xmlavec la mise en page et activity_bar.javaqui correspond à la classe Java correspondant à cela R.layout.foo.

Dans foo.xmldéfinir un identifiant pour la mise en page entière:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:id="@+id/foo" .../>

Et activity_bar.javadéfinissez la couleur dans le onCreate():

public class activity_bar extends AppCompatActivty {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.foo);

            //Set an id to the layout
        RelativeLayout currentLayout = 
                    (RelativeLayout) findViewById(R.id.foo);

        currentLayout.setBackgroundColor(Color.RED);
        ...
    }
    ...
}

J'espère que ça aide.

T.Woody
la source