androidのlayoutのXMLでボタンとSurfaceViewを配置

androidネタが続きます。
自分はandroidのGUIツールををよく使います。
とても便利なので、使ったことがない人は使ってみてください。
ほとんどがXMLを直接修正する羽目になりますが(T_T)

たとえば、res/layout/main.xmlを以下の様にすると
上段にボタンが3つ、その下にSurfaceViewによる画像の描画、
そしてその下にボタンを配置することができます。
















※@string/とあるものはres/values/strings.xmlに定義を追加して下さい。

もちろんこれを全部手打ちしたら大変です。
しかし、SDKにはGUIのツールがあり、項目をドラッグアンドドロップすれば
ある程度は作ってくれるので、プログラムで部品を1つ1つnewしていくよりも
簡単です。
デザインが終わった時点で、完成図を見ることができるのも大きいですね。
是非活用しましょう。

デザインが終わったら、findViewByIdで、idを指定すれば
部品のオブジェクトが取得できるので、ハンドラなどの設定をすれば、
簡単にアプリが作れます。

ちなみにこのサンプルは、中段に赤い画像が左から右へ動いており、
上段のボタンで色を変え、下段のボタンで画像を止めるものです。
実行画面を貼っておきます。

画像


ポイントはSurfaceView のandroid:layout_heightに"100px"と数値を設定しているところです。
これにより、下段に部品を張り付けるスペースができます。
同様にandroid:layout_widthも数値を指定し、LinearLayoutすれば、
SurfaceView の横に部品を配置することもできますね。

XMLの直接修正のコツをつかめば、
これぐらいの画面はあっという間に作れるようになります。




(2010/09/23 追記)
コメントでご質問を頂いたので、回答をこちらに記載します。
コメント欄に回答したら文字数制限に引っ掛かりました(T_T)

とりあえず、ソースから描画に関わる処理を抜粋します。
動作確認はおろか、コンパイル確認すらしてませんが、
大体の感覚をつかんで頂けると幸いです。

--------------------------------------------------------------
public class MixedLayout extends Activity {
private DrawDisp dd;

public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView( R.layout.main );

// XMLよりSurfaceViewオブジェクトを取得
SurfaceView sv = (SurfaceView)findViewById( R.id.SV );

// DrawDispという自分で作成したクラスへオブジェクトを渡す
dd = new DrawDisp( this, sv );

// 以下省略
}
}

public class DrawDisp implements SurfaceHolder.Callback, Runnable {
private SurfaceHolder holder;
private Thread thread;
private boolean loop;

public DrawDisp( Context context, SurfaceView sv ) {
//SurfaceViewからholderを取得し、インターフェイスを設定する。
holder = sv.getHolder();
holder.addCallback( this );

//以下省略
}

public void surfaceChanged(SurfaceHolder arg0, int arg1, int arg2, int arg3) {
}

public void surfaceCreated(SurfaceHolder holder) {
thread = new Thread( this );
loop = true;
thread.start();
}

public void surfaceDestroyed(SurfaceHolder holder) {
loop = false;
try {
thread.join();
} catch ( Exception e ) {}
}

public void run() {
while ( loop ) {
Canvas canv = holder.lockCanvas();
//描画処理をここに入れる

holder.unlockCanvasAndPost( canv );
try {
Thread.sleep( 10 );
Thread.yield();
} catch ( Exception e ) {}
}
}
}
--------------------------------------------------------------

SurfaceHolder.CallbackというinterfaceをどのようにXMLで定義したSurfaceViewに
設定するかがカギになります。
オブジェクトを ID から取得し、setメソッドでinterfaceをimplementsしたオブジェクトを指定すると
interfaceがコールバックされます。
Androidはこのパターンが多いので、ぜひ覚えてください。

ブログ気持玉

クリックして気持ちを伝えよう!

ログインしてクリックすれば、自分のブログへのリンクが付きます。

→ログインへ

なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス
ガッツ(がんばれ!)
かわいい

気持玉数 : 60

なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー) なるほど(納得、参考になった、ヘー)
驚いた 驚いた 驚いた 驚いた 驚いた 驚いた
面白い 面白い 面白い 面白い 面白い
ナイス ナイス ナイス ナイス ナイス ナイス ナイス
ガッツ(がんばれ!) ガッツ(がんばれ!) ガッツ(がんばれ!) ガッツ(がんばれ!) ガッツ(がんばれ!) ガッツ(がんばれ!)
かわいい かわいい かわいい かわいい かわいい

この記事へのコメント

良い情報ありがとうございます。
2010年09月20日 22:34
とても参考になります。

一つ質問がありますけれども、
『findViewByIdで、idを指定すれば部品のオブジェクトが取得できるので、
ハンドラなどの設定をすれば、簡単にアプリが作れます。』
と言うところで、

ID指定、オブジェクトを取得しましたが、それからどういう風にすれば
SurfaceViewに画像を描画することが出来るのか分からないですね。

この方法を使って描画するサンプルがなかなか検索されないので、悩んでいます。
申し訳ないですが、実際に画像を描画する処理が書いている
Javaサンプルも見てもらえませんか?
T_T
2010年09月23日 20:05
良い情報ありがとうございます。さん
とりあえず、本文に回答を追記しました。
参考になれば喜ばしい限りです。

この記事へのトラックバック

  • 大同跟?

    Excerpt: http://hi.baidu.com/dtdear3 大同 Weblog: 大同跟? racked: 2013-05-21 03:07
  • www.whilelimitless.com

    Excerpt: android layout XML_{^_SurfaceViewzu __u_O/EFu_u_O Weblog: www.whilelimitless.com racked: 2017-01-06 23:50
  • healthtipsblogweb.wordpress.com

    Excerpt: gnjxyqdimp Weblog: Healthtipsblogweb.wordpress.com racked: 2018-09-20 22:17
  • https://30daysofcreativity.com/body-fortress-parent-company-definition

    Excerpt: androidのlayoutのXMLでボタンとSurfaceViewを配置 涙目ブログ/ウェブリブログ Weblog: 30daysofcreativity.com racked: 2018-09-21 15:05
  • https://prodatingtoday.co.uk/

    Excerpt: androidのlayoutのXMLでボタンとSurfaceViewを配置 涙目ブログ/ウェブリブログ Weblog: Http://prodatingtoday.co.uk racked: 2018-09-22 17:40
  • knowyourthrush.com

    Excerpt: androidのlayoutのXMLでボタンとSurfaceViewを配置 涙目ブログ/ウェブリブログ Weblog: Knowyourthrush.com racked: 2018-10-12 20:03