Как сделать свечение текста?

Можем ли мы применить свечение к любому тексту, как показано ниже:

enter image description here

Обновлено: Пожалуйста, расскажите мне, какие вещи мне нужно создать примерно так: enter image description here

Мне нужен специальный шрифт для этого?

Ответ 1

Как установить синюю тень для текстового просмотра, используя android:shadowColor и установив android:shadowDx и android:shadowDy в ноль, с довольно большим android:shadowRadius?

Ответ 3

Бемму прав. Это лучший способ, не пройдя полный маршрут OpenGL. Вы также должны убедиться, что у TextView есть дополняющая прокладка, установленная с каждой стороны, иначе тень большого радиуса, соответствующая цвету исходного текста (или светлый оттенок), покажет отсечение тени на каждой стороне TextView.

Возможно, вы даже сможете достичь еще большего эффекта размытия, создав многоуровневую группу представлений с увеличением/уменьшением эффектом dropshadow (не уверен, что будет выглядеть как perf perf)

Ответ 4

У меня было обходное решение для достижения этого требования, но все же не идеальное....

Результат выборки:

https://cloud.githubusercontent.com/assets/5714437/3962552/d5c29fee-276c-11e4-9ea3-d1b31d8c54ac.png

Ключевой момент: * Дайте Paint и рисуйте восемь раз в onDraw() из TextView *

public class ShadowTextView extends TextView {
private final Paint mStrokePaint = new Paint();
private final Rect mTextBounds = new Rect();
public ShadowTextView(Context context) {
    super(context);
    setupPaint();
}

public ShadowTextView(Context context, AttributeSet attrs) {
    super(context, attrs);
    setupPaint();
}

public ShadowTextView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
    setupPaint();
}

protected void onDraw(Canvas canvas) {
    // Get the text to print
    final String text = super.getText().toString();
    // Figure out the drawing coordinates
    super.getPaint().getTextBounds(text, 0, text.length(), mTextBounds);
    float radius = (float) Math.hypot(3, 3);
    // draw everything
    drawShadow(canvas, text, 0, 3);
    drawShadow(canvas, text, 0, -3);
    drawShadow(canvas, text, 3, 0);
    drawShadow(canvas, text, -3, 0);

    drawShadow(canvas, text, radius, radius);
    drawShadow(canvas, text, -radius, radius);
    drawShadow(canvas, text, radius, -radius);
    drawShadow(canvas, text, -radius, radius);

    super.onDraw(canvas);
}

private void drawShadow (Canvas canvas, String text, float dx, float dy) {
    mStrokePaint.setShadowLayer(3, dx, dy, Color.BLACK);
    mStrokePaint.setXfermode(new PorterDuffXfermode(Mode.SRC_ATOP));
    canvas.drawText(text,
            0.0f + this.getPaddingLeft() * 1.0f , (super.getHeight() + mTextBounds.height()) * 0.5f,
            mStrokePaint);
}

private final void setupPaint() {
    mStrokePaint.setAntiAlias(true);
    mStrokePaint.setStyle(Paint.Style.FILL);
    // setup stroke
    mStrokePaint.setColor(0x75000000);
    mStrokePaint.setStrokeWidth(5);
    mStrokePaint.setTextSize(super.getTextSize());
    mStrokePaint.setFlags(super.getPaintFlags());
    mStrokePaint.setTypeface(super.getTypeface());
    mStrokePaint.setStrokeCap(Cap.ROUND);
    mStrokePaint.setStrokeJoin(Join.ROUND);
}

}

Ответ 5

<TextView
    android:id="@+id/glowingText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:padding="5dp"
    android:shadowColor="#cf1d1d"
    android:shadowDx="0.0"
    android:shadowDy="0.0"
    android:shadowRadius="8"
    android:text="Radioactive"
    android:textColor="#cf1d1d"
    android:textSize="20sp" />

Я рекомендую добавить прокладку, потому что эффект тени/свечения увеличивает необходимое пространство.

Для пользовательских шрифтов создайте папку с именем "fonts" в вашей папке с ресурсами. Затем поместите в него свои .ttf файлы. Вы можете конвертировать файлы .otf онлайн, есть много сайтов.

Поместите это в свой класс

Typeface myFont = Typeface.createFromAsset(getAssets(), "fonts/yourCustomFont.ttf");

и именно так вы устанавливаете шрифт в текстовое окно

yourTextView.setTypeface(myFont);

Я тестировал эффект свечения, и он также работает с пользовательскими шрифтами. Имейте в виду, что вам, возможно, придется уменьшить размер вашего текста, потому что пользовательские шрифты по какой-то причине больше. Я использовал половину размера sp, который я обычно использовал.

Ответ 6

Вот простой css3 для эффекта свечения

.button {
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding: 10px;
  border: none;
  font: normal 48px/normal "Warnes", Helvetica, sans-serif;
  color: rgba(255,255,255,1);
  text-decoration: normal;
  text-align: center;
  -o-text-overflow: clip;
  text-overflow: clip;
  white-space: pre;
  text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #ff00de , 0 0 70px #ff00de , 0 0 80px #ff00de , 0 0 100px #ff00de ;
  -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
}

.button:hover {
  text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #00ffff , 0 0 70px #00ffff , 0 0 80px #00ffff , 0 0 100px #00ffff ;
}
body{background:#000;}
<link async href="#" onclick="location.href='http://fonts.googleapis.com/css?family=Warnes'; return false;" data-generated="http://enjoycss.com" rel="stylesheet" type="text/css"/>

<div class="button">Neel UPadhyay</div>