ラベル Font の投稿を表示しています。 すべての投稿を表示
ラベル Font の投稿を表示しています。 すべての投稿を表示

2013年5月15日水曜日

TextViewのフォントをメイリオに変更してみた


ブログのフォントをメイリオに変更した記事を書いたら「ANDROID メイリオ」で検索してくれた方がたくさんいたようなので、ANDROIDアプリのフォントをメイリオに変更する記事を書きます。

やり方


1.メイリオフォントを入手

どこかから meiryo.ttf、meiryob.ttf をダウンロード(ググれば出てくるはず)

2.メイリオフォントを配置

assetsフォルダにダウンロードした meiryo.ttf、meiryob.ttf をコピー

3.TextViewを用意



    
    
    
    
    



4.MainActivityを編集

import android.os.Bundle;
import android.app.Activity;
import android.graphics.Typeface;
import android.view.Menu;
import android.widget.TextView;

public class MainActivity extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

        TextView meiryo = (TextView)findViewById(R.id.meiryo);
        meiryo.setTypeface(Typeface.createFromAsset(getAssets(), "meiryo.ttf"));
        
        TextView meiryob = (TextView)findViewById(R.id.meiryob);
        meiryob.setTypeface(Typeface.createFromAsset(getAssets(), "meiryob.ttf"));
 }

 @Override
 public boolean onCreateOptionsMenu(Menu menu) {
  // Inflate the menu; this adds items to the action bar if it is present.
  getMenuInflater().inflate(R.menu.main, menu);
  return true;
 }

}

5.実行

うまくできました。

2013年5月11日土曜日

AndEngineで文字列描画(ビットマップフォントの利用)

作ったビットマップフォントをAndEngineで表示してみる。
ここまできてやっとHelloWorld。

1.プロジェクトにビットマップフォントを追加
  ・asset/fontフォルダを作成
  ・ビットマップフォント(font.fnt,font_0.png)をコピー
フォントをコピー
2.MainActivityを編集
  こんな感じ。

package com.example.andenginetest;

import org.andengine.engine.camera.Camera;
import org.andengine.engine.options.EngineOptions;
import org.andengine.engine.options.ScreenOrientation;
import org.andengine.engine.options.resolutionpolicy.RatioResolutionPolicy;
import org.andengine.entity.scene.Scene;
import org.andengine.entity.scene.background.Background;
import org.andengine.entity.text.Text;
import org.andengine.entity.text.TextOptions;
import org.andengine.opengl.font.BitmapFont;
import org.andengine.ui.activity.SimpleBaseGameActivity;
import org.andengine.util.HorizontalAlign;
import org.andengine.util.color.Color;


public class MainActivity extends SimpleBaseGameActivity
{
 private final int CAMERA_WIDTH = 480;
 private final int CAMERA_HEIGHT = 800;

 @Override
 public EngineOptions onCreateEngineOptions()
 {
  // 描画範囲のインスタンス化
  Camera camera = new Camera(0, 0, CAMERA_WIDTH, CAMERA_HEIGHT);

  EngineOptions eo = new EngineOptions(
  // タイトルバー非表示
    true,
    // 縦画面固定
    ScreenOrientation.PORTRAIT_FIXED,
    // 縦横比保持したまま最大まで拡大
    new RatioResolutionPolicy(CAMERA_WIDTH, CAMERA_HEIGHT),
    // 描画範囲
    camera);

  return eo;
 }

 @Override
 protected void onCreateResources()
 {
 }

 @Override
 protected Scene onCreateScene()
 {
  Scene scene = new Scene();

  // 背景真っ白
  scene.setBackground(new Background(Color.WHITE));

  // ビットマップフォント読み込み
  BitmapFont font = new BitmapFont(
    getTextureManager() //TextureManager
    , getAssets()  //AssetManager
    , "font/font.fnt" //フォントの場所を指定
    );
  font.load();

  //テキストのインスタンスを作成
  Text text = new Text(
    20     //X座標
    , 20    //Y座標
    , font    //フォント
    , "Hello World!!" //描画文字列
    , 20    //最大文字数
    //オプション(左寄せ)
    , new TextOptions(HorizontalAlign.LEFT),
    getVertexBufferObjectManager()
    );

  //SceneにTextを追加
  scene.attachChild(text);

  return scene;
 }

}

フォント読み込んでTextインスタンスにして
Sceneにドーン。って感じ。

3.実行
実行画面
動いた。

おまけ:
ビットマップフォント作った後にfntファイルの1,2行目を修正してないと下記エラー出るよ。

java.lang.NumberFormatException: Invalid int: "1 outline=0"
05-06 18:13:31.879: E/AndEngine(7286): MainActivity.onCreateScene failed. @(Thread: 'GLThread 17752')
05-06 18:13:31.879: E/AndEngine(7286): java.lang.NumberFormatException: Invalid int: "1 outline=0"
05-06 18:13:31.879: E/AndEngine(7286):  at java.lang.Integer.invalidInt(Integer.java:138)
05-06 18:13:31.879: E/AndEngine(7286):  at java.lang.Integer.parse(Integer.java:375)
05-06 18:13:31.879: E/AndEngine(7286):  at java.lang.Integer.parseInt(Integer.java:366)
05-06 18:13:31.879: E/AndEngine(7286):  at java.lang.Integer.parseInt(Integer.java:332)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.opengl.font.BitmapFont$BitmapFontInfo.<init>(BitmapFont.java:610)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.opengl.font.BitmapFont.<init>(BitmapFont.java:211)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.opengl.font.BitmapFont.<init>(BitmapFont.java:176)
05-06 18:13:31.879: E/AndEngine(7286):  at com.example.andenginetest.MainActivity.onCreateScene(MainActivity.java:62)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.ui.activity.SimpleBaseGameActivity.onCreateScene(SimpleBaseGameActivity.java:48)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.ui.activity.BaseGameActivity$3.onCreateResourcesFinished(BaseGameActivity.java:169)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.ui.activity.SimpleBaseGameActivity.onCreateResources(SimpleBaseGameActivity.java:43)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.ui.activity.BaseGameActivity.onCreateGame(BaseGameActivity.java:181)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.ui.activity.BaseGameActivity.onSurfaceCreated(BaseGameActivity.java:110)
05-06 18:13:31.879: E/AndEngine(7286):  at org.andengine.opengl.view.EngineRenderer.onSurfaceCreated(EngineRenderer.java:80)
05-06 18:13:31.879: E/AndEngine(7286):  at android.opengl.GLSurfaceView$GLThread.guardedRun(GLSurfaceView.java:1494)
05-06 18:13:31.879: E/AndEngine(7286):  at android.opengl.GLSurfaceView$GLThread.run(GLSurfaceView.java:1240)



疑問:

  • TextureManagerって何するやつ
  • AssetManagerって何するやつ
  • TextOptions何があるの
  • VertexBufferObjectManagerって何する奴

2013年5月10日金曜日

ビットマップフォントの作成

AndEngineで文字を描画するためにビットマップフォントを作った。

1.ゲームに使えそうなフォントを探す
  ライセンスとか見ながら使えそうなものを探す。
  自分はこれ→ しねきゃぷしょん http://chiphead.jp/font/htm/cinecaption.htm
しねきゃぷしょん
なんて素敵なんでしょう。

2.ダウンロードしたフォントをOSにインストール。
  C:\Windows\Fontsにでもドラッグ&ドロップでOK

3.BMFontをインストール
  ビットマップフォント作成ツール。
  ここから→http://www.angelcode.com/products/bmfont/

4.BMFontを起動

5.Options→Font Settings
  ・フォント選択
  ・サイズ指定
  ・OK
BMFont - Font Settings

6.Options→Export Settings
  ・画像サイズ指定 
   小さいと分割されるみたいだけどAndEngineで読み込めるのかな?
   出力してみて1枚に収まるように調整したら512,512になった。
  ・Bit depthは32
  ・Presetsを "Black text with alpha"に。
   これで黒文字。White~にすれば白文字
   OpenGL側で表示色自在にできるんだろうけどまだやり方しらないし黒文字にした。
  ・Font descriptionはText
  ・Texturesはpng
  ・OK
BMFont - Export Settings
7.含める文字の選択
  ・右のリストをクリックすると一括でOn/Offできる。
  ・左下に選択した文字数が出てるっぽい
  ・漢字以外全部選んどいた。
BMFont - 文字の選択
8.Option→Save bitmap font as...
  ・適当な名前で保存。(今回はfontって付けた)

9.でけた
  ・font.fnt 座標がかかれたファイル
  ・font_0.png フォント画像

10.fntファイルの修正
  AndEngineで読み込もうとしたらエラーするもんだから
  fntファイルを少し修正した。
  1,2行目の末尾を少し削除。

修正前
info face="しねきゃぷしょん" size=24 bold=0 italic=0 charset="" unicode=1 stretchH=100 smooth=1 aa=1 padding=0,0,0,0 spacing=1,1 outline=0
common lineHeight=24 base=21 scaleW=512 scaleH=512 pages=1 packed=0 alphaChnl=0 redChnl=3 greenChnl=3 blueChnl=3

修正後
info face="しねきゃぷしょん" size=24 bold=0 italic=0 charset="" unicode=1 stretchH=100 smooth=1 aa=1 padding=0,0,0,0 spacing=1,1
common lineHeight=24 base=21 scaleW=512 scaleH=512 pages=1 packed=0


おわり。

使い方はまた別途。

Related Posts Plugin for WordPress, Blogger...