Android - тінь на текст?


184

Мені цікаво, як додати тінь на текст в android?

У мене є такий код, який застосовується на растровій карті, і я хотів бути затіненим ...

paint.setColor(Color.BLACK);
paint.setTextSize(55);
paint.setFakeBoldText(false);
paint.setShadowLayer(1, 0, 0, Color.BLACK); //This only shadows my whole view...

2
Майте на увазі, що у вас повинен бути ShadowRadius.

2
Ви повинні позначити відповідь @fhucho зліва як правильну відповідь; Я намагався зробити те саме і пропустив це, коли я побачив цю публікацію, оскільки жодна відповідь не була позначена як правильна. Відповідь, яка була оприлюднена багато разів, вводить в оману, оскільки вона не стосується програмного додавання тіні.
Арелінг

Відповіді:


390

Ви повинні мати змогу додати такий стиль (узятий із вихідного коду для 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>

І у своєму макеті використовуйте такий стиль:

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

Редагувати: вихідний код можна переглянути тут: https://github.com/google/ringdroid

Edit2: Щоб задати цей стиль програмно, ви зробите щось подібне (модифіковане з цього прикладу, щоб відповідати ресурсам ringdroid зверху)

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

сигнатура setTextAppearanceIS

public void setTextAppearance (контекст контексту, int залишається)

Оскільки: API Level 1
Встановлює колір тексту, розмір, стиль, колір підказки та колір виділення із зазначеного ресурсу TextAppearance.


1
Але ОП просить користувальницькі віджети!
HRJ

Це може бути, але нічого не говорить про те, що він не міг використовувати цей метод у ImageView. Я припускав, що він малює безпосередньо, бо не міг зрозуміти інакше.
Джим Шуберт

приголомшливо ... додає потрібної глибини стандартному шрифту і робить його виглядати в 10 разів краще на міцному тлі.
Метт К


2
Дійсно допоміг, великий палець бро
Саад Білал

72

Можна робити і в коді, і в XML. Встановити лише 4 основні речі.

  1. тіньовий колір
  2. Shadow Dx - він визначає зміщення тіні по осі X. Можна надати значення - / +, де -Dx малює тінь зліва від тексту та + Dx праворуч
  3. shadow Dy - він визначає зміщення тіні по осі Y. -Dy вказує тінь над текстом, а + Dy вказує нижче тексту.
  4. радіус тіні - визначає, наскільки тінь має бути розмитою по краях. Надайте невелику цінність, якщо тінь має бути чіткою. Інакше інакше.

напр

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

Це малює помітну тінь на лівій нижній частині тексту. У код можна додати щось подібне;

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

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>

У наведеному вище коді макета XML textview1 задається з ефектом Shadow у макеті. нижче - елементи конфігурації

android: shadowDx - задає зміщення тіні по осі X. Можна надати значення - / +, де -Dx малює тінь зліва від тексту та + Dx праворуч

android: shadowDy - він задає зміщення тіні по осі Y. -Dy вказує тінь над текстом, а + Dy вказує нижче тексту.

android: shadowRadius - визначає, скільки тіні повинно бути розмитим по краях. Надайте невелику цінність, якщо тінь має бути чіткою. android: shadowColor - задає колір тіні


Ефект тіні на Android TextView прагматично

Використовуйте фрагмент коду нижче, щоб отримати ефект тіні на другому TextView прагматично.

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

Вихід:

введіть тут опис зображення


3

Якщо ви хочете досягти тіні, як та, що Android робить у запуску, ми керуємо цими значеннями. Вони корисні, якщо ви хочете створити TextViews, які відображатимуться як віджет, без фону.

android:shadowColor="#94000000"
android:shadowDy="2"
android:shadowRadius="4"

2

Намалюйте 2 тексти: один сірий (це буде тінь), а зверху намалюйте другий текст (y координуйте на 1 px більше, ніж текст тіні).


1
Дякую, хлопці, за ваші пости. Я вирішив це, використовуючи два об’єкти фарби та використовуючи setShadaowLayer на одному з об’єктів paint.
Грендізер

2
Це може виглядати нормально, якщо ви використовуєте альфа, але не буде схоже на приємну, м'яку, декларативно встановлену тінь.
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>

потім використовувати як

 <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"/>
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.