Android: ¿sombra en el texto?

184

Me pregunto cómo agregar sombras en el texto en Android.

Tengo el siguiente código que se aplica en un mapa de bits y quería ser sombreado ...

paint.setColor(Color.BLACK);
paint.setTextSize(55);
paint.setFakeBoldText(false);
paint.setShadowLayer(1, 0, 0, Color.BLACK); //This only shadows my whole view...
Grendizer
fuente
2
Tenga en cuenta que debe tener un ShadowRadius.
2
Debe marcar la respuesta @fhucho left como la respuesta correcta; Estaba tratando de hacer lo mismo y me lo perdí la primera vez que vi esta publicación, ya que ninguna respuesta se marcó como correcta. La respuesta votada muchas veces es engañosa, ya que no se relaciona con agregar la sombra mediante programación.
areyling

Respuestas:

390

Debería poder agregar el estilo, así (tomado del código fuente de Ringdroid):

  <style name="AudioFileInfoOverlayText">
    <item name="android:paddingLeft">4px</item>
    <item name="android:paddingBottom">4px</item>
    <item name="android:textColor">#ffffffff</item>
    <item name="android:textSize">12sp</item>
    <item name="android:shadowColor">#000000</item>
    <item name="android:shadowDx">1</item>
    <item name="android:shadowDy">1</item>
    <item name="android:shadowRadius">1</item>
  </style>

Y en su diseño, use el estilo de esta manera:

 <TextView android:id="@+id/info"
       android:layout_width="fill_parent"
       android:layout_height="wrap_content"
       style="@style/AudioFileInfoOverlayText"
       android:gravity="center" />

Editar: el código fuente se puede ver aquí: https://github.com/google/ringdroid

Edit2: para establecer este estilo mediante programación, haría algo como esto (modificado a partir de este ejemplo para que coincida con los recursos de ringdroid de arriba)

TextView infoTextView = (TextView) findViewById(R.id.info);
infoTextView.setTextAppearance(getApplicationContext(),  
       R.style.AudioFileInfoOverlayText);

La firma de setTextAppearancees

public void setTextAppearance (Contexto contextual, int resid)

Desde: API Nivel 1
Establece el color del texto, el tamaño, el estilo, el color de las sugerencias y el color de resaltado del recurso TextAppearance especificado.

Jim Schubert
fuente
1
¡Pero el OP está pidiendo widgets personalizados!
HRJ
Puede ser, pero no hay nada que sugiera que no pudo usar este método en un ImageView. Asumí que estaba pintando directamente porque no podría resolverlo de otra manera.
Jim Schubert
impresionante ... agrega la profundidad necesaria a la fuente estándar y hace que se vea 10 veces mejor en un fondo sólido.
Matt K
@Farhan ver aquí: stackoverflow.com/questions/4630440/…
Jim Schubert
2
Realmente ayudado, pulgares arriba hermano
Saad Bilal
72

Puedes hacer ambos en código y XML. Solo se deben configurar 4 elementos básicos.

  1. color de sombra
  2. Shadow Dx: especifica el desplazamiento del eje X de la sombra. Puede dar valores - / +, donde -Dx dibuja una sombra a la izquierda del texto y + Dx a la derecha
  3. shadow Dy: especifica el desplazamiento del eje Y de la sombra. -Dy especifica una sombra sobre el texto y + Dy especifica debajo del texto.
  4. radio de sombra: especifica cuánto se debe desenfocar la sombra en los bordes. Proporcione un valor pequeño si la sombra debe ser prominente. De lo contrario.

p.ej

    android:shadowColor="@color/text_shadow_color"
    android:shadowDx="-2"
    android:shadowDy="2"
    android:shadowRadius="0.01"

Esto dibuja una sombra prominente en el lado inferior izquierdo del texto. En el código, puede agregar algo como esto;

    TextView item = new TextView(getApplicationContext());
    item.setText(R.string.text);
    item.setTextColor(getResources().getColor(R.color.general_text_color));
    item.setShadowLayer(0.01f, -2, 2,   getResources().getColor(R.color.text_shadow_color));
codeFood
fuente
7
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical"
    android:padding="20dp" >

    <TextView
        android:id="@+id/textview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:shadowColor="#000"
        android:shadowDx="0"
        android:shadowDy="0"
        android:shadowRadius="50"
        android:text="Text Shadow Example1"
        android:textColor="#FBFBFB"
        android:textSize="28dp"
        android:textStyle="bold" />

    <TextView
        android:id="@+id/textview2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="Text Shadow Example2"
        android:textColor="#FBFBFB"
        android:textSize="28dp"
        android:textStyle="bold" />

</LinearLayout>

En el código de diseño XML anterior, textview1 se proporciona con efecto de sombra en el diseño. a continuación se muestran los elementos de configuración

android: shadowDx : especifica el desplazamiento del eje X de la sombra. Puede dar valores - / +, donde -Dx dibuja una sombra a la izquierda del texto y + Dx a la derecha

android: shadowDy : especifica el desplazamiento del eje Y de la sombra. -Dy especifica una sombra sobre el texto y + Dy especifica debajo del texto.

android: shadowRadius : especifica cuánto se debe desenfocar la sombra en los bordes. Proporcione un valor pequeño si la sombra debe ser prominente. android: shadowColor: especifica el color de la sombra


Efecto de sombra en Android TextView pragmáticamente

Use el fragmento de código a continuación para obtener el efecto de sombra en el segundo TextView de forma pragmática.

TextView textv = (TextView) findViewById(R.id.textview2);
textv.setShadowLayer(30, 0, 0, Color.RED);        

Salida:

ingrese la descripción de la imagen aquí

Hoque MD Zahidul
fuente
3

Si desea lograr una sombra como la que Android hace en el Iniciador, estamos administrando estos valores. Son útiles si desea crear TextViews que aparecerán como un widget, sin fondo.

android:shadowColor="#94000000"
android:shadowDy="2"
android:shadowRadius="4"
Roc Boronat
fuente
2

Dibuje 2 textos: uno gris (será la sombra) y encima dibuje el segundo texto (coordenada y 1 px más que el texto sombreado).

fhucho
fuente
1
Gracias a todos por sus publicaciones. Lo resolví usando dos objetos de pintura y usando setShadaowLayer en uno de los objetos de pintura.
Grendizer
2
Esto puede verse bien si usa alfa, pero no se verá como la sombra agradable, suave y declarativamente establecida.
ShibbyUK
2
 <style name="WhiteTextWithShadow" parent="@android:style/TextAppearance">
    <item name="android:shadowDx">1</item>
    <item name="android:shadowDy">1</item>
    <item name="android:shadowRadius">1</item>
    <item name="android:shadowColor">@android:color/black</item>
    <item name="android:textColor">@android:color/white</item>
</style>

luego usar como

 <TextView
            android:id="@+id/text"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="15sp"
            tools:text="Today, May 21"
            style="@style/WhiteTextWithShadow"/>
Dan Alboteanu
fuente