Wie kann man Text zum Leuchten bringen?

Können wir einen Glow-Effekt auf jeden Text anwenden, wie unten gezeigt:

Aktualisiert: Bitte sagen Sie mir auch, welche Dinge ich brauche, um so etwas zu erstellen:

Benötige ich dafür eine spezielle Schriftart?

Wie wäre es, wenn Sie einen blauen Schatten für die Textansicht mit android:shadowColorund setzen android:shadowDxund android:shadowDyauf Null setzen, mit einem ziemlich großen Wert android:shadowRadius?

<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" />

Ich empfehle, eine Polsterung hinzuzufügen, da der Schatten- / Glüheffekt den benötigten Platz vergrößert.

Erstellen Sie für benutzerdefinierte Schriftarten einen Ordner mit dem Namen "Schriftarten" in Ihrem Assets-Ordner. Dann legen Sie Ihre .ttf-Dateien darin. Sie können .otf-Dateien online konvertieren. Es gibt viele Websites.

Setzen Sie dies in Ihre Klasse ein

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

Auf diese Weise stellen Sie die Schriftart auf Ihre Textansicht ein

yourTextView.setTypeface(myFont);

Ich habe den Glow-Effekt getestet und er funktioniert auch mit benutzerdefinierten Schriftarten. Beachten Sie, dass Sie möglicherweise die Größe Ihres Textes verringern müssen, da benutzerdefinierte Schriftarten aus irgendeinem Grund größer sind. Ich habe die Hälfte der sp-Größe verwendet, die ich normalerweise verwenden würde.

Bemmu hat recht. Das ist bei weitem der beste Weg, ohne die vollständige OpenGL-Route zu gehen. Sie möchten auch sicherstellen, dass in der TextView auf jeder Seite eine angemessene Polsterung vorhanden ist. Andernfalls zeigt ein Schatten mit großem Radius, der der ursprünglichen Textfarbe entspricht (oder ein leicht hellerer Schatten), den Dropshadow-Ausschnitt auf jeder Seite der TextView.

Möglicherweise können Sie sogar noch mehr Unschärfeeffekt erzielen, indem Sie eine überlagerte Ansichtsgruppe mit zunehmenden / abnehmenden Dropshadow-Effekten erstellen (Sie sind sich jedoch nicht sicher, wie die Renderleistung aussehen würde).

Ich hatte eine Problemumgehung, um die Anforderung zu erfüllen, aber immer noch nicht perfekt ...

Das Beispielergebnis:

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

Wichtigster Punkt: * Geben Sie eine Farbe und zeichnen Sie acht Mal onDraw()aus 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);
}

}

Hier ist ein einfaches CSS3 für den Glow-Effekt

.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="http://fonts.googleapis.com/css?family=Warnes" data-generated="http://enjoycss.com" rel="stylesheet" type="text/css"/>

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