2012年03月09日

gravityとlayout_gravityを動的に変更する


前回はxmlソースファイルによりgravity属性を変更しました
gravityとlayout_gravity
javaコードによる属性変更はsetGravityを使用します
これでjavaコードでの変更や動的に変更などが可能です
実行結果を前回と同様になるように設定しました

package blog.test;
 
import android.app.Activity;
import android.os.Bundle;
import android.view.Gravity;
import android.view.ViewGroup.LayoutParams;
import android.widget.Button;
import android.widget.LinearLayout;

 
public class TestActivity extends Activity {

	@Override
	public void onCreate(Bundle savedInstanceState) {
	    super.onCreate(savedInstanceState);

	    //親LinearLayoutを作成
	    LinearLayout layout0 = new LinearLayout(this);
	    layout0.setOrientation(LinearLayout.VERTICAL);
		LayoutParams p0 = new LayoutParams(LayoutParams.FILL_PARENT,
		        LayoutParams.FILL_PARENT);
	    //子LinearLayout1/2/3を作成
		LinearLayout layout1 = new LinearLayout(this);
		LinearLayout layout2 = new LinearLayout(this);
		LinearLayout layout3 = new LinearLayout(this);
		layout1.setOrientation(LinearLayout.VERTICAL);

		LayoutParams p1 = new LayoutParams(LayoutParams.FILL_PARENT,
		        LayoutParams.WRAP_CONTENT);
		layout0.addView(layout1,p1);
		layout0.addView(layout2,p1);
		layout0.addView(layout3,p1);
		setContentView(layout0, p0);



		//ボタンを追加
		Button button1 = new Button(this);
		button1.setHeight(0);
		button1.setText("left-top");
		LayoutParams lp1=new LayoutParams(LayoutParams.WRAP_CONTENT,
                LayoutParams.WRAP_CONTENT);
		button1.setGravity(Gravity.TOP);
		layout1.setGravity(Gravity.LEFT);
		layout1.addView(button1,lp1);
		
		Button button2 = new Button(this);
		button2.setHeight(0);
		button2.setText("center-center");
		LayoutParams lp2=new LayoutParams(LayoutParams.WRAP_CONTENT,
                LayoutParams.WRAP_CONTENT);
		button2.setGravity(Gravity.CENTER);
		layout2.setGravity(Gravity.CENTER);
		layout2.addView(button2,lp2);
		
		Button button3 = new Button(this);
		button3.setText("right-bottom");
		LayoutParams lp3=new LayoutParams(LayoutParams.WRAP_CONTENT,
                LayoutParams.WRAP_CONTENT);
		button3.setGravity(Gravity.BOTTOM);
		layout3.setGravity(Gravity.RIGHT);
		layout3.addView(button3,lp3);
		
		
	}

}
まず画面全体をカバーする親LinearLayoutを作成します
次にその中に子LinearLayout1/2/3を作成します
子LinearLayoutのGravityをそれぞれLEFT/CENTER/RIGHTとします
layout1.setGravity(Gravity.LEFT);の部分
これは子LinearLayoutの中に入れるbuttonに適用されます
前回のlayout_gravityに当たる)
最後にbuttonの中の文字のgravityを設定すれば完了です

これでlayout_gravityとgravityを動的に変更することができました
device47.png
スポンサードリンク

posted by kenken at 18:45 | Comment(0) | TrackBack(0) | レイアウト カスタマイズ | このブログの読者になる | 更新情報をチェックする

gravityとlayout_gravity


ViewGroupやその中のViewやウィジェットをうまく配置するために
gravity属性を使用します
gravityとは重力のことでどちらに重力をかけるか・・・
みたいなことだと思います
gravity属性を変えることで様々な位置にウィジェットを配置することができます
gravityには、ウィジェットの内部に対する配置を指定するgravity属性
親ウィジェットに対するウィジェットの配置を指定する
layout_gravity属性の2種類があります
この違いが結構ややこしいので理解して使い分けていきたいと思います

gravityの変更の仕方はxmlファイルで変更します
(もちろんjavaソースでも変更できます・・・)
プロパティーの設定方法

各属性の設定内容一覧です
またxmlソースで"|"で区切って複数指定することも可能です

指定値 効果
top コンテナの上部に配置し、サイズ変更は行いません
bottom コンテナの下部に配置し、サイズ変更は行いません
left コンテナの左側に配置し、サイズ変更は行いません
right コンテナの右側に配置し、サイズ変更は行いません
center_vertical 上下中央に配置し、サイズ変更は行いません
fill_vertical オブジェクトの高さを、コンテナのサイズに合わせます
center_horizontal 左右中央に配置し、サイズ変更は行いません
fill_horizontal オブジェクトの幅を、コンテナのサイズに合わせます
center 上下左右中央に配置し、サイズ変更は行いません
fill オブジェクトの高さ・幅を、コンテナのサイズに合わせます
clip_vertical top/bottomの追加オプションとして、オブジェクトの上部/下部の境界をコンテナの境界に合わせます
clip_horizontal left/rightの追加オプションとして、オブジェクトの左側/右側の境界をコンテナの境界に合わせます



layout_gravity
layout_gravityは前述の通り親ウィジェット(ViewGroup)
に対するウィジェットの配置を指定するものです
例として3つのtextViewをleft・center・rightにそれぞれ配置してみたいと思います
xmlソースは以下の通りです
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:orientation="vertical" >

    <TextView
    	android:id="@+id/textView1"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="left" android:layout_gravity="left"/>

    <TextView
    	android:id="@+id/textView2"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="center" android:layout_gravity="center"/>

    <TextView
    	android:id="@+id/textView3"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="right" android:layout_gravity="right"/>

</LinearLayout>
実行すると・・・
device46.png
それぞれ親ウィジェット(Linearlayout)に対して
textViewが寄っていることがわかります

gravity
次にgravityですがこれはウィジェットの内部に対する配置を指定するものです
今度はボタンを配置しそれぞれlayout_gravityをleft・center・rightとし
なかのテキストのgravityをtop・center・bottomとしたいと思います
xmlソース
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:orientation="vertical" >

    <Button
    	android:id="@+id/button1"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="left-top" android:gravity="top" android:layout_gravity="left"/>

    <Button
    	android:id="@+id/button2"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="center-center" android:gravity="center" android:layout_gravity="center"/>

    <Button
    	android:id="@+id/button3"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="right-bottom" android:layout_gravity="right" android:gravity="bottom"/>

</LinearLayout>

これを実行すると
device47.png
ボタンと中の文字がそれぞれ寄っていることがわかります
スポンサードリンク

posted by kenken at 17:05 | Comment(0) | TrackBack(0) | レイアウト カスタマイズ | このブログの読者になる | 更新情報をチェックする

幅と高さの指定


レイアウトのViewおよびViewGroupには様々な属性があり、それらを変更していくことで
柔軟なレイアウト作成が可能になります

幅と高さの指定
幅と高さの変更はlayout_width属性とlayout_height属性を使います
この属性には以下のような値を指定します
wrap_content
ウィジェットの領域を適当に調整して配置
それぞれ最適な大きさを作ってくれます

fill_parent
残っている領域すべて使って配置

単位付きの数値を指定
数字と単位で記載します
単位は下記を参照
いろいろな単位

xmlファイルで指定
xmlファイルで指定する場合Graphical Layoutで設定するものと
xmlを直接記載する方法があります
Graphical Layoutではbuttonを例に設定してみます
プロパティーの設定方法
まず左側のForm Widgetsからbuttonを1つ配置します
次に配置したbuttonを選択し上部メニューから
ウィンドウ→ビューの表示→プロパティー
を選択します
device43.png
プロパティーが出てきたらその他の項目のLayout heightや
Layout weightを変更していきます
device44.png
例としてbuttonを3つ配置し一つはwrap_content
一つは横のみfill_parent、3つ目がどちらもfill_parent
に設定してみました
またその時のxmlソースは以下のようになっています
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:orientation="vertical" >

    <Button
    	android:id="@+id/button1"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="wrap_content" />

    <Button
    	android:id="@+id/button2"
    	android:layout_width="fill_parent"
    	android:layout_height="wrap_content"
    	android:text="横幅をfill_parent" />

    <Button
    	android:id="@+id/button3"
    	android:layout_width="fill_parent"
    	android:layout_height="fill_parent"
    	android:text="どちらもfill_parent" />

</LinearLayout>
これを実行するとmain画面が
device45.png
こうなります

幅と高さをコードで指定
同様のものをjavaコードで作成すると以下のようになります
package blog.test;
 
import android.app.Activity;
import android.os.Bundle;
import android.view.ViewGroup.LayoutParams;
import android.widget.Button;
import android.widget.LinearLayout;

 
public class TestActivity extends Activity {

	@Override
	public void onCreate(Bundle savedInstanceState) {
	    super.onCreate(savedInstanceState);

	    setContentView(R.layout.main);
	    //LinearLayoutを作成
		LinearLayout layout = new LinearLayout(this);
		//LinearLayoutの属性を設定
		layout.setOrientation(LinearLayout.VERTICAL);
		//LinearLayoutのパラメータ設定
		LayoutParams p0 = new LayoutParams(LayoutParams.FILL_PARENT,
		        LayoutParams.FILL_PARENT);
		//表示設定
		setContentView(layout, p0);
		
		//ボタンを追加
		Button button1 = new Button(this);
		button1.setText("wrap_content");
		LayoutParams p1 = new LayoutParams(LayoutParams.WRAP_CONTENT,
		        LayoutParams.WRAP_CONTENT);
		layout.addView(button1,p1);
		
		Button button2 = new Button(this);
		button2.setText("横幅をfill_parent");
		LayoutParams p2 =  new LayoutParams(LayoutParams.FILL_PARENT,
		        LayoutParams.WRAP_CONTENT);
		layout.addView(button2, p2);
		
		Button button3 = new Button(this);
		button3.setText("どちらもfill_parent");
		LayoutParams p3 = new LayoutParams(LayoutParams.FILL_PARENT,
		        LayoutParams.FILL_PARENT);
		layout.addView(button3, p3);
		
		
	}

}
LayoutParamsでパラメータをそれぞれ設定し
addViewで表示するウィジェットとパラメータを指定しています
実行結果は先ほどと同様になります
スポンサードリンク

posted by kenken at 15:01 | Comment(0) | TrackBack(0) | レイアウト カスタマイズ | このブログの読者になる | 更新情報をチェックする

LinearLayoutを利用する


LinearLayout
今回は使用頻度の高いLinearLayoutに関してです
ViewGroupクラスのサブクラスであるLinearLayoutは
直訳すれば一直線にウィジェットを配置するレイアウトクラスです
ViewGroupはいくつか種類があり効果的にウィジェットを配置していくために
選択していきます

イメージとしてはこんなかんじ
device38.png
VeiwGroupのなかにいくつものView(ウィジェット)を配置していきます
LinearLayoutには縦型と横型の2種類があります
LinearLayout(Vertical):縦型
LinearLayout(Horizontal):横型
device39.png

LinearLayoutの作成方法
LinearLayoutの作成方法は主に2つあります
xmlファイルで作成する
resフォルダのlayoutフォルダにmain.xmlというのがあると思います
(任意で名前を変更していたら違う名前になってます)
device40.png
そこをダブルクリックするとGraphical Layout作成画面になると思います
もし違う画面が立ち上がってしまうならmain.xmlを右クリック
→プログラムから開く→Androidレイアウト・エディターで開いてみてください

次に左側のパレットからレイアウトを選択しLinearLayoutを右側の画面に
ドラック&ドロップで作成できます
device41.png
下のタブのmain.xmlを選択すると作成したxmlを見ることができます
確認するとちゃんと追加されているのがわかります
(初期状態でLinearLayoutが存在するため現状2つ配置されている)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:layout_width="fill_parent"
	android:layout_height="fill_parent"
	android:orientation="vertical" >

    <LinearLayout
    	android:id="@+id/linearLayout1"
    	android:layout_width="fill_parent"
    	android:layout_height="wrap_content"
    	android:orientation="vertical" >
    </LinearLayout>

</LinearLayout>
同様にドラック&ドロップでウィジェットをガシガシ追加してみちゃってくださいw
きちんとxmlソースに反映されるはずです

device42.png

javaソースで作成する
2つ目はJavaによるコードを作成しLinearLayoutを追加していきます
手順としては
1.LinearLayoutを作成する
2.属性を設定する
3.表示する
の3つです
以下にjavaソースを記載します
package blog.test;
 
import android.app.Activity;
import android.os.Bundle;
import android.widget.LinearLayout;

 
public class TestActivity extends Activity {

	@Override
	public void onCreate(Bundle savedInstanceState) {
	    super.onCreate(savedInstanceState);

	    setContentView(R.layout.main);
	    //LinearLayoutを作成
		LinearLayout layout = new LinearLayout(this);
		//属性をVERTICALに設定
		layout.setOrientation(LinearLayout.VERTICAL);
		//layoutを表示
		setContentView(layout);
		
	}

}
これでmainにLinearLayoutが追加されました
スポンサードリンク

posted by kenken at 13:35 | Comment(0) | TrackBack(0) | レイアウト LinearLayout | このブログの読者になる | 更新情報をチェックする
×

この広告は1年以上新しい記事の投稿がないブログに表示されております。