Establecer el color de fondo del elemento de diseño de Android


198

Estoy tratando de clonar el diseño de una actividad de un conjunto de diapositivas en el diseño de la interfaz de usuario de Android . Sin embargo, estoy teniendo un problema con una tarea muy simple.

He creado el diseño como se muestra en la imagen, y el encabezado es a TextViewen a RelativeLayout. Ahora deseo cambiar el color de fondo del RelativeLayout, sin embargo, parece que no puedo entender cómo.

Sé que puedo establecer la android:backgroundpropiedad en la RelativeLayoutetiqueta en el archivo XML, pero ¿en qué lo configuro? Quiero definir un nuevo color que pueda usar en varios lugares. ¿Es un drawableo un string?

Además, ¿esperaría que haya una forma muy simple de hacerlo desde el diseñador de la interfaz de usuario de Android Eclipse que debo perder?

Actualmente estoy un poco frustrado, ya que esta debería ser una actividad que se realiza con unos pocos clics como máximo. Entonces cualquier ayuda es muy apreciada. :)

Diseño de actividad de Android


28
¿Qué software usaste para dibujar el gráfico en el lado derecho?
lucas

8
@lucas: no dibujé los diagramas, como señalé en las preguntas, es de un conjunto de diapositivas en el diseño de la interfaz de usuario de Android. Ver el enlace en la pregunta.
Bjarke Freund-Hansen

Respuestas:


280

Puede usar recursos de color simples , generalmente especificados dentro res/values/colors.xml.

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

y usa esto a través de android:background="@color/red". Este color también se puede usar en cualquier otro lugar, por ejemplo, como color de texto. Referencialo en XML de la misma manera, u obténgalo en código vía getResources().getColor(R.color.red).

También puede usar cualquier recurso dibujable como fondo, use android:background="@drawable/mydrawable"para esto (eso significa dibujos dibujables de 9 parches, mapas de bits normales, dibujos dibujables de formas, ...).


66
Funciona como un encanto, gracias. ¿Podría señalarme la referencia donde debería haber leído esto?
Bjarke Freund-Hansen

66
Uhh en realidad: No. Acabo de buscar en los documentos, esto es algo bastante estándar de Android, pero parece que en ninguna parte está realmente documentado. Ni los tutoriales en el sitio de desarrollo ni las muestras de api hacen uso de esto. El documento de Android carece de algo cuando se trata de algunas características. Creo que lo recogí por accidente en algunos tutoriales externos. Por lo general, es una buena idea explorar las muestras de API y los proyectos de muestra. Puede encontrar el código dentro de la ANDROID_SDK\samplescarpeta (para varias versiones de Android). Toda la aplicación de muestra api también viene preinstalada en cada instancia del emulador.

2
También acabo de comprobar el diseñador de la interfaz de usuario. Nada fácil de encontrar. Pero recomiendo escribir cosas a mano en el xml de todos modos. El diseñador mejoró mucho recientemente, pero en mi opinión todavía no es utilizable. No solo hay algunas opciones limitadas, el diseño a veces se ve completamente diferente en un dispositivo real (especialmente cuando se usan recursos extraíbles referenciados. No se escalan correctamente o incluso no se muestran en absoluto en mi experiencia) . Pruebe sus diseños en su dispositivo o en un emulador.

1
para algunos colores "predeterminados", puede usar esta sintaxis: android: background = "@ android: color / white"
inicio

1
getResources (). getColor () está en desuso ahora.
Rohit Bandil

90

Las respuestas anteriores son agradables. También puede ir así programáticamente si lo desea

Primero, su diseño debe tener una identificación. Agréguelo escribiendo la siguiente +idlínea en res / layout / *. Xml

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

Luego, en su código Java, realice los siguientes cambios.

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

Aparte de esto, si tiene el color definido en colors.xml, también puede hacer mediante programación:

rl.setBackgroundColor(ContextCompat.getColor(getContext(), R.color.red));

24
Si lo quieres dinámico, creo que no puedes usar XML.
Guillermo Gutiérrez

1
+1 porque necesito cambiarlo en tiempo de ejecución de acuerdo con el indicador de estado; También pude recuperar el color original usando la constante Color.TRANSPARENT.
Zac

10
@ BjarkeFreund-Hansen Él reconoce las otras respuestas y proporciona esta solución programática. No es un voto negativo digno.
Anubian Noob

44
@ BjarkeFreund-Hansen, la pregunta es cómo configurar el fondo, no cómo definir el color, leer correctamente. Y qué pasa si la pregunta es sobre eso. Lo reconozco y le dije "también puedes ir como" ... así que él puede ir o no. También puede ayudar a otros como ya puede ver. puedes ??
Android Killer

77
más uno solo para compensar el menos uno de @ BjarkeFreund-Hansen
Rahul

42

Puede usar android:background="#DC143C", o cualquier otro valor RGB para su color. No tengo problemas para usarlo de esta manera, como se indica aquí


55
-1 porque escribí explícitamente "Quiero definir un nuevo color que pueda usar en varios lugares" en la pregunta, porque no quería codificar el valor del color, sino definirlo como un recurso que puedo usar en varios lugares.
Bjarke Freund-Hansen

66
@GMsoF: Oh, funciona, pero no responde la pregunta.
Bjarke Freund-Hansen

21

los

res/values/colors.xml.

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

ejemplo no funcionó para mí, pero el

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

funcionó para mí en el elemento de diseño relativo como un atributo.


10
¿Olvidó envolver la etiqueta de color con una etiqueta de recursos?
Elimirks

19

Si desea cambiar un color rápidamente (y no tiene números hexadecimales memorizados), Android tiene algunos colores preestablecidos a los que puede acceder de esta manera:

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

Hay 15 colores entre los que puede elegir, lo cual es bueno para probar cosas rápidamente, y no necesita configurar archivos adicionales.

La configuración de un archivo values ​​/ colors.xml y el uso de hexadecimal directo como se explicó anteriormente seguirá funcionando.


4

4 formas posibles, use una que necesite.

1. Kotlin

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

2. Enlace de datos

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

O una declaración más útil

<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));

2

Android Studio 2.1.2 (o posiblemente antes) te permitirá elegir entre una rueda de colores:

Rueda de color en Android Studio

Obtuve esto agregando lo siguiente a mi diseño:

android:background="#FFFFFF"

Luego hice clic en el color FFFFFF e hice clic en la bombilla que apareció.


1

Kotlin

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

o

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

-

linearLayout.setBackgroundColor(ContextCompat.getColor(vista.context, R.color.newColor))

0

Las respuestas sobre todo son estáticas. Pensé que daría una respuesta dinámica. Los dos archivos que necesitarán estar sincronizados son los relativos foo.xmlcon el diseño y activity_bar.javaque corresponde a la clase Java correspondiente a esteR.layout.foo .

En foo.xmlestablecer una identificación para todo el diseño:

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

Y en activity_bar.javaestablecer el color en el 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);
        ...
    }
    ...
}

Espero que esto ayude.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.