アプリケーションで Font Awesome を使用しようとしていますが、Typeface.createFromAsset()
を使用してフォントを統合できましたが、このフォントで提供されているアイコンも使用したいのですが、今のところはそれができる。
この特定のフォントには、メディアプレーヤーコントロール、ファイルシステムアクセス、矢印などのアイコンのために、Unicode Private Use Area(PUA)内にアイコンが含まれています。
Androidでアイコンや記号を含むフォントを使用している人はいますか?
Font AwesomeはAndroidアプリでうまく機能しているようです。私は次のことをしました:
fontawesome-webfont.ttf
をassestsフォルダーにコピーしました各アイコンのstrings.xmlにエントリを作成しました。例えば、心のために:
<string name="icon_heart"></string>
私のXMLレイアウトのビューで上記のエントリを参照しました:
<Button
Android:id="@+id/like"
style="?android:attr/buttonStyleSmall"
...
Android:text="@string/icon_heart" />
OnCreateメソッドにフォントをロードし、適切なビューに設定しました:
Typeface font = Typeface.createFromAsset( getAssets(), "fontawesome-webfont.ttf" );
...
Button button = (Button)findViewById( R.id.like );
button.setTypeface(font);
IcoMoonを試してください: http://icomoon.io
たとえば、再生アイコンを選択し、文字「P」を割り当てて、ファイルicomoon.ttf
をアセットフォルダーにダウンロードしたとします。アイコンの表示方法は次のとおりです。
xml:
<TextView
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:textSize="48sp"
Android:text="P" />
Java:
Typeface typeface = Typeface.createFromAsset(getAssets(), "icomoon.ttf");
textView.setTypeface(typeface);
美しいAndroidアプリの作成に関する講演を行いました。これには、アイコンフォントの使用に関する説明と、アイコンをさらにきれいにするためのグラデーションの追加が含まれます。 http://www.sqisland.com/ talks/beautiful-Android
アイコンフォントの説明は、スライド34から始まります。 http://www.sqisland.com/talks/beautiful-Android/#34
遅すぎるかもしれませんが、私は同じニーズを持っていたので、これを公開しました https://github.com/liltof/font-awsome-for-Android これはAndroid ready XMLですキース・コーウィンが言ったように使用可能なフォントのバージョン
それが他の人を助けることを願っています。
上記のように素晴らしい例であり、素晴らしい作品:
Typeface font = Typeface.createFromAsset(getAssets(), "fontawesome-webfont.ttf" );
Button button = (Button)findViewById( R.id.like );
button.setTypeface(font);
しかし! >これは、xmlから設定したボタン内の文字列の場合に機能します。
<string name="icon_heart"></string>
button.setText(getString(R.string.icon_heart));
動的に追加する必要がある場合は、これを使用できます。
String iconHeart = "";
String valHexStr = iconHeart.replace("&#x", "").replace(";", "");
long valLong = Long.parseLong(valHexStr,16);
button.setText(getString((char)valLong+"");
String.xmlに文字列を追加せずにプログラムによるsetTextが必要な場合
こちらの16進コードをご覧ください:
http://fortawesome.github.io/Font-Awesome/cheatsheet/
置換&#xf066; 0xf066へ
Typeface typeface = Typeface.createFromAsset(getAssets(), "fontawesome-webfont.ttf");
textView.setTypeface(typeface);
textView.setText(new String(new char[]{0xf006 }));
小さくて便利な この目的のために設計されたライブラリ :
dependencies {
compile 'com.shamanland:fonticon:0.1.9'
}
Google Play 。でデモを入手
レイアウトにフォントベースのアイコンを簡単に追加できます。
<com.shamanland.fonticon.FontIconView
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
Android:text="@string/ic_Android"
Android:textSize="@dimen/icon_size"
Android:textColor="@color/icon_color"
/>
Font-iconは、xmlからDrawable
として展開できます。
<?xml version="1.0" encoding="utf-8"?>
<font-icon
xmlns:Android="http://schemas.Android.com/apk/res-auto"
Android:text="@string/ic_Android"
Android:textSize="@dimen/big_icon_size"
Android:textColor="@color/green_170"
/>
Javaコード:
Drawable icon = FontIconDrawable.inflate(getResources(), R.xml.ic_Android);
リンク:
このヘルパークラスをC#(Xamarin)で作成して、テキストプロパティをプログラムで設定しました。それは私にとってかなりうまく機能します:
internal static class FontAwesomeManager
{
private static readonly Typeface AwesomeFont = Typeface.CreateFromAsset(App.Application.Context.Assets, "FontAwesome.ttf");
private static readonly Dictionary<FontAwesomeIcon, string> IconMap = new Dictionary<FontAwesomeIcon, string>
{
{FontAwesomeIcon.Bars, "\uf0c9"},
{FontAwesomeIcon.Calendar, "\uf073"},
{FontAwesomeIcon.Child, "\uf1ae"},
{FontAwesomeIcon.Cog, "\uf013"},
{FontAwesomeIcon.Eye, "\uf06e"},
{FontAwesomeIcon.Filter, "\uf0b0"},
{FontAwesomeIcon.Link, "\uf0c1"},
{FontAwesomeIcon.ListOrderedList, "\uf0cb"},
{FontAwesomeIcon.PencilSquareOutline, "\uf044"},
{FontAwesomeIcon.Picture, "\uf03e"},
{FontAwesomeIcon.PlayCircleOutline, "\uf01d"},
{FontAwesomeIcon.SignOut, "\uf08b"},
{FontAwesomeIcon.Sliders, "\uf1de"}
};
public static void Awesomify(this TextView view, FontAwesomeIcon icon)
{
var iconString = IconMap[icon];
view.Text = iconString;
view.SetTypeface(AwesomeFont, TypefaceStyle.Normal);
}
}
enum FontAwesomeIcon
{
Bars,
Calendar,
Child,
Cog,
Eye,
Filter,
Link,
ListOrderedList,
PencilSquareOutline,
Picture,
PlayCircleOutline,
SignOut,
Sliders
}
Javaに簡単に変換できるはずです。それが誰かを助けることを願っています!
Font Awesomeに使用するライブラリの1つは次のとおりです。
https://github.com/Bearded-Hen/Android-Bootstrap
具体的には、
https://github.com/Bearded-Hen/Android-Bootstrap/wiki/Font-Awesome-Text
ドキュメントは理解しやすいです。
最初に、必要な依存関係をbuild.gradleに追加します。
dependencies {
compile 'com.beardedhen:androidbootstrap:1.2.3'
}
次に、これをXMLに追加できます。
<com.beardedhen.androidbootstrap.FontAwesomeText
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
fontawesometext:fa_icon="fa-github"
Android:layout_margin="10dp"
Android:textSize="32sp"
/>
上記のコード例を使用する場合は、必ずルートレイアウトに追加してください。
xmlns:fontawesometext="http://schemas.Android.com/apk/res-auto"
レイアウトxmlファイルで直接使用でき、setTypeface
を使用する必要のない別のNiceソリューションがあります。
Joan Zapataの Iconify です。 こちら の新機能Iconify v2を読むことができます。 build.gradleファイルに依存関係を追加するだけで使用できる9種類のフォントライブラリが含まれています。
レイアウトxmlファイルでは、次のウィジェットから選択できます。
com.joanzapata.iconify.widget.IconTextview
com.joanzapata.iconify.widget.IconButton
com.joanzapata.iconify.widget.IconToggleButton
FontViewライブラリを使用すると、アプリのアイコン/グラフィックとして通常/ユニコードのフォント文字を使用できます。アセットまたはネットワークの場所を介してフォントをロードできます。
このライブラリの利点は次のとおりです。
1 - it takes care of remote resources for you
2 - scales the font size in dynamically sized views
3 - allows the font to easily be styled.
https://github.com/shellum/fontView
例:
Layout:
<com.finalhack.fontview.FontView
Android:id="@+id/someActionIcon"
Android:layout_width="80dp"
Android:layout_height="80dp" />
Java:
fontView.setupFont("fonts/font.ttf", character, FontView.ImageType.CIRCLE);
fontView.addForegroundColor(Color.RED);
fontView.addBackgroundColor(Color.WHITE);
最初にアセットフォルダーを作成し、fontawesomeアイコン(.ttf)をコピーしますアセットフォルダーの作成方法
app->右クリック-> new-> folder-> asset folder
次のステップは、.ttfファイルをダウンロードする方法をダウンロードしますか? ここをクリックしてください-> 解凍してWebフォントをダウンロードした後、ダウンロードボタンをクリックします。最後に、True Text Style(ttf)paste asset folderを選択します。
JavaのxmlおよびAndroidファイルの設計方法
app-> res-> values string.xml
resources
string name="calander_font" > <string
resources
この1つのフォントの例、さらにUnicode ここをクリック
Activity_main.xml
<TextView
Android:layout_width="30dp"
Android:layout_height="30dp"
Android:id="@+id/calander_view"/>
MainActivity.Java
calander_tv = (TextView)findViewById(R.id.calander_view);
Typeface typeface = Typeface.createFromAsset(getAssets(),"/fonts/fa-solid-900.ttf");
calander_tv.setTypeface(typeface);
calander_tv.setText(R.string.calander_font);
出力:
プログラムで追加する方法がわからない場合は、この方法で追加する必要があります。
button_info.setText(R.string.icon_heart);
button_info.append(" Hallo"); //<<--- This is the tricky part
私はパーティーに少し遅れていますが、これを行うことができるカスタムビューを作成しました。デフォルトではエンタイポに設定されていますが、任意のアイコンフォントを使用するように変更できます:github.com/MarsVard/IconView
//ライブラリの編集は古く、サポートされていません...新しいものはこちら https://github.com/MarsVard/IonIconView
すべての答えは素晴らしいのですが、ライブラリを使用したくなかったため、1行Javaコードで各ソリューションを使用すると、Activities
とFragments
が非常に面倒になりました。そこで、次のようにTextView
クラスを上書きしました。
public class FontAwesomeTextView extends TextView {
private static final String TAG = "TextViewFontAwesome";
public FontAwesomeTextView(Context context) {
super(context);
init();
}
public FontAwesomeTextView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public FontAwesomeTextView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
@TargetApi(Build.VERSION_CODES.Lollipop)
public FontAwesomeTextView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
init();
}
private void setCustomFont(Context ctx, AttributeSet attrs) {
TypedArray a = ctx.obtainStyledAttributes(attrs, R.styleable.TextViewPlus);
String customFont = a.getString(R.styleable.TextViewPlus_customFont);
setCustomFont(ctx, customFont);
a.recycle();
}
private void init() {
if (!isInEditMode()) {
Typeface tf = Typeface.createFromAsset(getContext().getAssets(), "fontawesome-webfont.ttf");
setTypeface(tf);
}
}
public boolean setCustomFont(Context ctx, String asset) {
Typeface typeface = null;
try {
typeface = Typeface.createFromAsset(ctx.getAssets(), asset);
} catch (Exception e) {
Log.e(TAG, "Unable to load typeface: "+e.getMessage());
return false;
}
setTypeface(typeface);
return true;
}
}
あなたがすべきことは、フォントttf
ファイルをassets
フォルダーにコピーすることです。そして、各アイコン文字列を見つけるために this cheat sheet を使用します。
お役に立てれば。
いくつかの素晴らしいフォントのみが必要な場合は、 http://fa2png.io を使用して通常のピクセル画像を生成することもできます。ただし、新しいアイコン/ボタンを定期的に追加する場合は、.ttfバージョンの方が柔軟性が高いため、お勧めします。