android - tipo - formato de correo gmail

Color en caja con letras a la gmail.

Question

Me pregunté cómo se generan y si se generan cada vez que abro la aplicación o se almacenan (almacenan en caché).

¿Es solo un lienzo (programáticamente) o usan XML? Algo así, y luego añaden programáticamente la letra:

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<size android:width="1px" android:height="1dp"/>
<solid android:color="#FFFFF5EE/>
</shape>

Answer 1

se generan cada vez que abro la aplicación o se almacenan (se almacenan en caché)

Pequeña columna A, pequeña columna B. Hay un pequeño caché usado, pero no es lo que estás pensando. Cada mosaico se puede dividir en 4 partes, el caché se utiliza para recuperar una posición particular. En cuanto al fondo, los colores se asignan mediante String.hashCode para garantizar que la misma dirección de correo electrónico (o clave) siempre se asignará al mismo color. Pero la letra real se dibuja utilizando Canvas.drawText .

Aquí hay un ejemplo:

/**
* Used to create a {@link Bitmap} that contains a letter used in the English
* alphabet or digit, if there is no letter or digit available, a default image
* is shown instead
*/
public class LetterTileProvider {
/** The number of available tile colors (see R.array.letter_tile_colors) */
private static final int NUM_OF_TILE_COLORS = 8;
/** The {@link TextPaint} used to draw the letter onto the tile */
private final TextPaint mPaint = new TextPaint();
/** The bounds that enclose the letter */
private final Rect mBounds = new Rect();
/** The {@link Canvas} to draw on */
private final Canvas mCanvas = new Canvas();
/** The first char of the name being displayed */
private final char[] mFirstChar = new char[1];
/** The background colors of the tile */
private final TypedArray mColors;
/** The font size used to display the letter */
private final int mTileLetterFontSize;
/** The default image to display */
private final Bitmap mDefaultBitmap;
/**
* Constructor for <code>LetterTileProvider</code>
*
* @param context The {@link Context} to use
*/
public LetterTileProvider(Context context) {
final Resources res = context.getResources();
mPaint.setTypeface(Typeface.create("sans-serif-light", Typeface.NORMAL));
mPaint.setColor(Color.WHITE);
mPaint.setTextAlign(Align.CENTER);
mPaint.setAntiAlias(true);
mColors = res.obtainTypedArray(R.array.letter_tile_colors);
mTileLetterFontSize = res.getDimensionPixelSize(R.dimen.tile_letter_font_size);
mDefaultBitmap = BitmapFactory.decodeResource(res, android.R.drawable.sym_def_app_icon);
}
/**
* @param displayName The name used to create the letter for the tile
* @param key The key used to generate the background color for the tile
* @param width The desired width of the tile
* @param height The desired height of the tile
* @return A {@link Bitmap} that contains a letter used in the English
* alphabet or digit, if there is no letter or digit available, a
* default image is shown instead
*/
public Bitmap getLetterTile(String displayName, String key, int width, int height) {
final Bitmap bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
final char firstChar = displayName.charAt(0);
final Canvas c = mCanvas;
c.setBitmap(bitmap);
c.drawColor(pickColor(key));
if (isEnglishLetterOrDigit(firstChar)) {
mFirstChar[0] = Character.toUpperCase(firstChar);
mPaint.setTextSize(mTileLetterFontSize);
mPaint.getTextBounds(mFirstChar, 0, 1, mBounds);
c.drawText(mFirstChar, 0, 1, 0 + width / 2, 0 + height / 2
+ (mBounds.bottom - mBounds.top) / 2, mPaint);
} else {
c.drawBitmap(mDefaultBitmap, 0, 0, null);
}
return bitmap;
}
/**
* @param c The char to check
* @return True if <code>c</code> is in the English alphabet or is a digit,
* false otherwise
*/
private static boolean isEnglishLetterOrDigit(char c) {
return ''A'' <= c && c <= ''Z'' || ''a'' <= c && c <= ''z'' || ''0'' <= c && c <= ''9'';
}
/**
* @param key The key used to generate the tile color
* @return A new or previously chosen color for <code>key</code> used as the
* tile background color
*/
private int pickColor(String key) {
// String.hashCode() is not supposed to change across java versions, so
// this should guarantee the same key always maps to the same color
final int color = Math.abs(key.hashCode()) % NUM_OF_TILE_COLORS;
try {
return mColors.getColor(color, Color.BLACK);
} finally {
mColors.recycle();
}
}
}

Aquí están los colores predeterminados y el tamaño del texto:

<!-- All of the possible tile background colors -->
<array name="letter_tile_colors">
<item>#f16364</item>
<item>#f58559</item>
<item>#f9a43e</item>
<item>#e4c62e</item>
<item>#67bf74</item>
<item>#59a2be</item>
<item>#2093cd</item>
<item>#ad62a7</item>
</array>
<!-- The default letter tile text size -->
<dimen name="tile_letter_font_size">33sp</dimen>
<!-- The deafult tile size -->
<dimen name="letter_tile_size">64dp</dimen>

Implementación

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
final Resources res = getResources();
final int tileSize = res.getDimensionPixelSize(R.dimen.letter_tile_size);
final LetterTileProvider tileProvider = new LetterTileProvider(this);
final Bitmap letterTile = tileProvider.getLetterTile("name", "key", tileSize, tileSize);
getActionBar().setIcon(new BitmapDrawable(getResources(), letterTile));
}

Resultados de "T", "E", "S", "T" :

Answer 2

A partir de la respuesta de @adneal, si queremos generar íconos circulares, podemos modificar la función getLetterTile de la siguiente manera:

public Bitmap getLetterTile(String displayName, String key, int width, int height, boolean round) {
final Bitmap bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
final char firstChar = displayName.charAt(0);
final Canvas c = mCanvas;
c.setBitmap(bitmap);
if (round) {
Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);
paint.setColor(pickColor(key));
c.drawCircle(width/2, height/2 , width/2, paint);
} else {
c.drawColor(pickColor(key));
}
if (isEnglishLetterOrDigit(firstChar)) {
mFirstChar[0] = Character.toUpperCase(firstChar);
mPaint.setTextSize(mTileLetterFontSize);
mPaint.getTextBounds(mFirstChar, 0, 1, mBounds);
c.drawText(mFirstChar, 0, 1, 0 + width / 2, 0 + height / 2
+ (mBounds.bottom - mBounds.top) / 2, mPaint);
} else {
c.drawBitmap(mDefaultBitmap, 0, 0, null);
}
return bitmap;
}