Androidプログラミング日記 (仮)

ちょっと発展した表示

あなたは

人目のプログラマーだよ。

 

Androidプログラミング日記 (仮).


Android ブログランキングへ 

 

 

 

ちょっと発展した表示プログラム

今までやってきたプログラムの総集編ではないですが、ちょっとだけ発展させたまとめみたいなことをやってみます。といっても書籍を見たら、いい感じだったので急遽書籍方面の道へ行きたいけどどこに入れ込もうかな・・あ、そうだこの辺に入れ込もう、という考えでこのタイミングで紹介です。

グラフィック表示

グラフィックを表示するやり方にはいくつかのやり方があります。イメージを表示する専用のビューを使うやり方とグラフィックを表示する専用の部品を自分で作って利用するやり方。それで今回は後者の方法をやってみたいと思います。

今回は元のソースコードは書かないでいきます。まずわたしは新しいプロジェクトを作成しました。名前を「View」に決定。そして作成できたらそのまま新規作成>クラス「MyView」、スーパークラスを「android.view.View」に設定し他はデフォルトのまま作成。そしてその作成したファイル「MyView.java」「ViewActivity」「main.xml」を開きました。まず「MyView.java」から

 

ファイル名「MyView」

package and.roid;

import android.content.Context;
import android.graphics.*;
import android.graphics.Paint.Style;
import android.util.AttributeSet;
import android.view.View;

public class MyView extends View {
private Context context;

  public MyView(Context context) {
  super(context);
  this.context = context;
  }

  public MyView(Context context,AttributeSet attrs){
  super(context,attrs);
  }

  protected void onDraw(Canvas c){
  super.onDraw(c);
  c.drawColor(Color.WHITE);

  int w = this.getWidth();
  int h = this.getHeight();
  Paint p = new Paint();
  p.setStyle(Style.STROKE);
  p.setColor(Color.DKGRAY);
  c.drawRect(new Rect(5,5,w-10,h-10), p);

  for(int i = 0;i᝺i++){
  Paint p2 = new Paint();
  p2.setStyle(Style.FILL);
  p2.setColor(Color.rgb(25*i, 0, 0));
  c.drawCircle(15*i+80, 15*i+80, 60, p2);
  }
 }
}

MyView()は「コンストラクタ」というものです。他からこのクラスを呼び出すときに初期化してくれるものですが、2つあるのは、それぞれ違う初期化の仕方を選べるようにしているみたいです。

cはCanvasでCanvasはキャンバスってことでなんとなく表示するところを白にってことですね。

ここのprotected void onDraw(Canvas c){}の中にc.を使って表示するという感じでしょうか。

次に「main.xml」を属性的なものはかわりませんが、ほぼまるまる変更

 

ファイル名「main.xml」

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app= "http://schemas.android.com/apk/res/and.roid"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<and.roid.MyView
android:id="@+id/MyView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</FrameLayout>

FrameLayoutは画面全体をいくつかのエリアに分けて部品を組み込む方式のレイアウトです。

xmlns:app= "http://schemas.android.com/apk/res/and.roid"の最後の部分はパッケージ名です。

 

そして「ViewActivity.java」を変更

 

ファイル名「ViewActivity.java」

package and.roid;

import android.app.Activity;
import android.os.Bundle;
import android.view.*;

public class ViewActivity extends Activity {
/** Called when the activity is first created. */
  @Override
  public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  requestWindowFeature(Window.FEATURE_NO_TITLE);
  getWindow().addFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN);

この上記赤字2行は、フルスクリーンにするためのコードと思って、このまま覚えました。

  setContentView(R.layout.main);
  //setContentView(new MyView(this));

今回のプログラムの場合は上記青字2行はどちらを使っても同じ動きをします。
  }
}
 

 

 

  こんな感じで表示されます。枠みたいな黒線がRectで、円が10個表示されてますね。

 

さて、わけのわからないうちに図形は表示されました。考え方としてはクラスという組み合わせで色々作っていく中で、プロジェクト作成でできるファイルはそれがないと動かないのでそれはそれ。あとは表示専用のファイル作ったり、それ使うためにxmlを変えたりするってことですね。

今回はもちょっとやります。図形表示ときたら次は画像表示ですね。

  この画像を使いました。

 

 

ファイル名「MyView.java」

package and.roid;

import android.content.Context;
import android.content.res.Resources;
import android.graphics.*;
import android.graphics.Paint.Style;
import android.util.AttributeSet;
import android.view.View;

public class MyView extends View {
private Context context;
private Bitmap image;

public MyView(Context context) {
super(context,null);
}

public MyView(Context context,AttributeSet attrs){
super(context,attrs);
this.context = context;

Resources resources = context.getResources();
image = BitmapFactory.decodeResource(resources, R.drawable.android005);
}

protected void onDraw(Canvas c){
super.onDraw(c);
c.drawColor(Color.WHITE);
if(image != null)
c.drawBitmap(image, 10, 10, new Paint());

int w = this.getWidth();
int h = this.getHeight();
Paint p = new Paint();
p.setStyle(Style.STROKE);
p.setColor(Color.DKGRAY);
c.drawRect(new Rect(5,5,w-10,h-10), p);
}
}

前にやった画像表示のメソッドをこっちに移したような感じですね。

if(image != null)でもしimageがなかったときのための安全策をほどこあしています。

ここでわたしは表示されないという状況に陥りました。原因は「ViewActivity.java」の最後のsetContentView(R.layout.main);
  //setContentView(new MyView(this));
が原因でした。setContentView(R.layout.main)で書くと正常に表示されました。このへんはまだまだ勉強が足りないです。

  こんな感じで表示されました。

これはBitmapを使った表示方法でした。Androidではもう一つ表示方法があるそうで、それが「Drawable」というものみたいです。

Drawableは、描画可能なオブジェクトです。これは単にViewに描画できるという意味ではなく、描画のための機能を備えたオブジェクトなのです。描画を行う際に必要となるさまざまな設定や機能などは、すべてdrawableの中に用意されています。Bitmapを使ったやり方の場合、Bitmapは単に「描画のための部品」であり、実際の描画はCanvasが行なっていましたが、Drawableはちがいます。Drawableは、すべて自分自身に用意してある機能を呼び出して描画を行うことができます。

今回は画像を100×100ドットに変えて表示してみます

 

ファイル名「MyView.java」

package and.roid;

import android.content.Context;
import android.content.res.Resources;
import android.graphics.*;
import android.graphics.Paint.Style;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.View;

public class MyView extends View {
  private Context context;
  private Drawable drawable;

  public MyView(Context context) {
  super(context,null);
  }

  public MyView(Context context,AttributeSet attrs){
  super(context,attrs);
  this.context = context;

  Resources resources = context.getResources();
  drawable = resources.getDrawable(R.drawable.android005);
  }

  protected void onDraw(Canvas c){
  super.onDraw(c);
  c.drawColor(Color.WHITE);
  if(drawable != null){
  drawable.setBounds(10, 10, 100, 100);
  drawable.draw(c);
  }

  int w = this.getWidth();
  int h = this.getHeight();
  Paint p = new Paint();
  p.setStyle(Style.STROKE);
  p.setColor(Color.DKGRAY);
  c.drawRect(new Rect(5,5,w-10,h-10), p);
  c.drawText("w:"+w+"h:"+h, 50, h-50, p);
  }
}

ソースコード的にはほぼ変わってませんね。

こちらの方法であれば描画をdrawableだけで管理できる。というお得な感じと思っていいのかもしれません。

  こんな感じです。

 

やはりここまで勉強してきて、同じようなコードが何度もでてきましたね。なのでプログラムのタイピングスピードもだいぶ上がってきました。

あと1ページ分だけちょっとやって、基本編は終わりにしようかと思います。javaの知識があれば覚えるのも早いのかもしれませんが、無理やりやっていって意味はわからないが、何度も打ち込んでこのコードは前に出てきたなとかっていう覚え方をして、あとから色々覚えるという方がわたしには合っています。なのでこのままがんばっていきましょう。

 

Androidプログラミング日記 (仮) | サイトマップ | 個人情報保護方針 | 応援メールテヘペロ | ©2012 Japan  相互リンク大募集中です