Android
Android CustomeViewの作り方 サンプルコード
Androidではいろんなビューの作り方がありますが、複雑な図形や動的な図形を出したいときは、CustomeViewというので作ると便利です。
実戦では使わなかったのですが、勉強したことをまとめておこうと思います。
私の場合はとある画像を配置したいというだけだったのですが、グラフや規則性のある図形などはCustomeViewがもっと活躍するでしょう。
実のところ、何が難しかったかというと、レイアウトファイル(xml)のほうですね。
res/layout/main_activity.xmlファイル内
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:custom="http://schemas.android.com/apk/res/my.application" //ここで、アプリケーションの名前を指定します
android:id="@+id/overlay_dialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:orientation="vertical" >
<my.application.view.BaloonUpward //CustomViewを呼び出すのは、この宣言だけで呼び出せます
android:id="@+id/baloon_1"
android:layout_width="300dp"
android:layout_height="300dp"
android:drawableLeft="@drawable/baloon_upward"
custom:showText="true" //このcustomのパラメーターは、最初のxmlnsで宣言します
/>
</LinearLayout>
次に、アトリビュートを指定します。attrs.xmlというファイルを/res/values/の中に作り、次のように宣言します。
/res/values/attrs.xml
<resources>
<declare-styleable name="BaloonUpward">
<!-- <attr name="android:baloonUpward" /> -->
<attr name="android:drawableLeft" />
<attr name="showText" format="boolean" />
</declare-styleable>
</resources>
CustomView自体を作ります。
public class BaloonUpward extends View {
private Drawable mLeftDrawable;
public BaloonUpward(Context context) {
super(context);
}
public BaloonUpward(Context context, AttributeSet attrs) {
super(context, attrs);
try{
TypedArray a = context.getTheme().obtainStyledAttributes(
attrs,
R.styleable.BaloonUpward,
0, 0
);
Drawable d = a.getDrawable(R.styleable.BaloonUpward_android_drawableLeft);
if (d != null) {
setLeftDrawable(d);
}
a.recycle();
}catch(Exception e){
Log.e("ばるーん", "エラー"+e);
}
}
public void setLeftDrawable(Drawable left) {
mLeftDrawable = left;
updateContentBounds();
invalidate();
}
private void updateContentBounds() {
//ここで画像の表示ポジションなどを動的に変更できます。
int left_float = 0;
int top_float = 0;
if (mLeftDrawable != null) {
mLeftDrawable.setBounds(left_float, top_float,
500, 500);
}
}
public void setLeftDrawableResource(int resId) {
Drawable d = getResources().getDrawable(resId);
setLeftDrawable(d);
}
@Override
protected void onDraw(Canvas canvas) {
if (mLeftDrawable != null) {
mLeftDrawable.draw(canvas);
}else{
Log.d("ばるーん","mLeftDrawableはnull");
}
}
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b) {
// TODO Auto-generated method stub
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//画面のサイズを測ってくれるので、画面サイズにあわせた何かをしたい場合
//ここでやります
int minw = getPaddingLeft() + getPaddingRight() + getSuggestedMinimumWidth();
int w = Math.max(minw, MeasureSpec.getSize(widthMeasureSpec));
// Whatever the width ends up being, ask for a height that would let the pie
// get as big as it can
int minh = (w - (int) 120) + getPaddingBottom() + getPaddingTop();
int h = Math.min(MeasureSpec.getSize(heightMeasureSpec), minh);
setMeasuredDimension(w, h);
}
}
Googleが下記にてサンプルコードを配布しています。
こちらも大変参考になります。
http://developer.android.com/training/custom-views/create-view.html
TechBoosterさん
http://techbooster.jpn.org/andriod/application/3013/
一番参考になったサイト
https://thenewcircle.com/s/post/1663/tutorial_enhancing_android_ui_with_custom_views_dave_smith_video