Android - bayangan pada teks?


184

Saya bertanya-tanya bagaimana cara menambahkan bayangan pada teks di android?

Saya memiliki kode berikut yang diterapkan pada bitmap dan saya ingin dibayangi ...

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

2
Perlu diingat bahwa Anda harus memiliki ShadowRadius.

2
Anda harus menandai jawaban @fhucho yang tersisa sebagai jawaban yang benar; Saya mencoba melakukan hal yang sama dan melewatkannya saat pertama kali saya melihat posting ini, karena tidak ada jawaban yang ditandai sebagai benar. Jawaban yang dipilih berkali-kali itu menyesatkan, karena tidak berhubungan dengan menambahkan bayangan secara terprogram.
— areyling

Jawaban:


390

Anda harus dapat menambahkan style, seperti ini (diambil dari kode sumber untuk 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>

Dan di tata letak Anda, gunakan gaya seperti ini:

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

Sunting: kode sumber dapat dilihat di sini: https://github.com/google/ringdroid

Sunting2: Untuk mengatur gaya ini secara terprogram, Anda akan melakukan sesuatu seperti ini (dimodifikasi dari contoh ini untuk mencocokkan sumber daya ringdroid dari atas)

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

Tanda tangan untuk setTextAppearanceadalah

public void setTextAppearance (Konteks konteks, int resid)

Sejak: API Level 1
Mengatur warna teks, ukuran, gaya, warna petunjuk, dan sorot warna dari sumber daya TextAppearance yang ditentukan.


1
Tetapi OP meminta widget khusus!
— HRJ

Itu mungkin, tetapi tidak ada yang menunjukkan bahwa dia tidak bisa menggunakan metode ini pada ImageView. Saya berasumsi dia sedang melukis langsung karena dia tidak bisa memahaminya.
— Jim Schubert

mengagumkan ... menambahkan kedalaman yang sangat dibutuhkan ke font standar dan membuatnya terlihat 10X lebih baik pada latar belakang yang solid.
— Matt K


2
Sungguh membantu, acungan jempol
— Saad Bilal

72

Anda dapat melakukannya dalam kode dan XML. Hanya 4 hal dasar yang harus ditetapkan.

  1. warna bayangan
  2. Shadow Dx - ini menentukan offset sumbu-X bayangan. Anda bisa memberikan nilai - / +, di mana -Dx menggambar bayangan di sebelah kiri teks dan + Dx di sebelah kanan
  3. shadow Dy - ini menentukan offset sumbu-Y bayangan. -Dy Menentukan bayangan di atas teks dan + Dy menentukan di bawah teks.
  4. radius radius - menentukan seberapa banyak bayangan harus dikaburkan di tepinya. Berikan nilai kecil jika bayangan harus menonjol. Atau sebaliknya.

misalnya

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

Ini menggambar bayangan yang menonjol di sisi kiri bawah teks. Dalam kode, Anda dapat menambahkan sesuatu seperti ini;

    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>

Dalam kode tata letak XML di atas, textview1 diberikan dengan efek Shadow di tata letak. di bawah ini adalah item konfigurasi

android: shadowDx - menentukan offset sumbu-X bayangan. Anda bisa memberikan nilai - / +, di mana -Dx menggambar bayangan di sebelah kiri teks dan + Dx di sebelah kanan

android: shadowDy - ini menentukan offset sumbu-Y bayangan. -Dy Menentukan bayangan di atas teks dan + Dy menentukan di bawah teks.

android: shadowRadius - menentukan seberapa banyak bayangan harus dikaburkan di tepinya. Berikan nilai kecil jika bayangan harus menonjol. android: shadowColor - menentukan warna bayangan


Efek Bayangan pada Android TextView secara pragmatis

Gunakan cuplikan kode di bawah ini untuk mendapatkan efek bayangan pada TextView kedua secara pragmatis.

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

Output:

masukkan deskripsi gambar di sini


3

Jika Anda ingin mencapai bayangan seperti yang dilakukan Android di Peluncur, kami mengelola nilai-nilai ini. Mereka berguna jika Anda ingin membuat TextViews yang akan muncul sebagai Widget, tanpa latar belakang.

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

2

Gambar 2 teks: satu abu-abu (itu akan menjadi bayangan) dan di atasnya gambarkan teks kedua (y koordinat 1px lebih dari bayangan teks).


1
Terima kasih teman-teman untuk posting Anda. Saya menyelesaikannya dengan menggunakan dua objek cat dan menggunakan setShadaowLayer di salah satu objek cat.
— Grendizer

2
Ini mungkin terlihat ok jika Anda menggunakan alpha, tetapi tidak akan terlihat seperti bayangan yang bagus, lembut, dan deklaratif.
— 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>

lalu gunakan sebagai

 <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"/>
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.