2012年05月10日

リストビューにボタンを配置する


オリジナルレイアウトを用いたリストビューの作成を応用して
リストビュー各行にボタンを配置したいと思います
基本的に解説はしますが前回作成したものをベースに作りこみたいと思いますw
リスト項目のレイアウトを自由にカスタマイズ(2)

まずは1行分のリストビューのレイアウト作成です
textViewとbuttonを1つずつ配置しました
textViewにweightを持たせbuttonを右側に寄せています
list.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="horizontal" >

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

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

次にmain.xmlですがこれは単にListviewのみ配置したものを用意しました
<?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" >

    <ListView
        android:id="@+id/listView1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >
    </ListView>
    
</LinearLayout>

さいごにMainActivity.javaですがこれも前回同様に独自に作成したクラス
private class ListMemberAdapterの中身を変更します
特に難しいことは行わず、textViewとButtonを指定して表示させる文字を
入力しただけです
MainActivity.java
package blog.test;
 
import java.util.ArrayList;
import java.util.List;
 
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ListView;
import android.widget.TextView;
 
public class MainActivity extends Activity {
 
	//独自クラスMemberを作成
    private class Member {
        private String name;

 
        public Member(String name) {
            this.name = name;

            
        }
 
        public String getName() {
            return name;
        }
 

    }
 
    //BaseAdapterを拡張した独自Adapterの定義
    private class ListMemberAdapter extends BaseAdapter {
        private Context context;
        private List list;
 
        public ListMemberAdapter(Context context) {
            super();
            this.context = context;
            //ListにMemberを追加する
            //追加にはMemberクラスを使用
            list = new ArrayList();
            list.add(new Member("Ichiro"));
            list.add(new Member("Matsui"));
            list.add(new Member("Darvish"));
        }
 
        
        public int getCount() {
            return list.size();
        }
 
        public Object getItem(int position) {
 
            return list.get(position);
        }
 
        public long getItemId(int position) {
            return position;
        }
 
        public View getView(int position, View convertView, ViewGroup parent) {
        	Member member = (Member) getItem(position);
 
            
            TextView tvName;
            Button mapButton;
            View v = convertView;

            if(v==null){
              LayoutInflater inflater = 
                (LayoutInflater)
                  getSystemService(Context.LAYOUT_INFLATER_SERVICE);
              v = inflater.inflate(R.layout.list, null);
            }

            if(member != null){
              tvName = (TextView) v.findViewById(R.id.textView1);
              mapButton = (Button) v.findViewById(R.id.button1);

              
              tvName.setText("Name : "+member.getName());
              mapButton.setText("Map");

            }
            return v;
        }
    }
    


	
	
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
 
        ListView lv = new ListView(this);
        setContentView(lv);
 
        lv.setAdapter(new ListMemberAdapter(this));
    }
}
inflaterを使い作成したlist.xmlを指定して表示させています
独自クラスMemberではただ単にnameのみを保持するクラスです
これを実行すると・・・
device104.png
このようにボタンが配置されているのがわかります
buttonのイベント取得は次回にしますww

スポンサードリンク

posted by kenken at 11:08 | Comment(0) | TrackBack(0) | ウィジェット トースト | このブログの読者になる | 更新情報をチェックする
2012年05月09日

リスト項目のレイアウトを自由にカスタマイズ(2)


レイアウトファイルを使用したリストビュー
前回はBaseAdapterクラスを拡張したリストビュー表示を行いました
リスト項目のレイアウトを自由にカスタマイズ
今回はgetViewメソッドで作成するViewにレイアウトファイルを指定して使ってみたいと思います
まずは1行分のレイアウトファイルを作成します
第1項目のみ大きく表示させるためTextsizeを30spにしています
list.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="TextView" android:textSize="30sp"/>

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

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

次にMainActivity.javaを変更します
前回同様BaseAdapterを独自に作成し
getCount・getItem・getItemId・getView を実装すればOKです
前回と異なるところはgetView内でLayoutInflater を用いて
独自xmlファイルから View オブジェクトを作成しています
MainActivity.java
package blog.test;
 
import java.util.ArrayList;
import java.util.List;
 
import android.app.Activity;
import android.content.Context;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.TextView;
 
public class MainActivity extends Activity {
 
	//独自クラスMemberを作成
    private class Member {
        private String name,team;
        private int number;
 
        public Member(String name, int number , String team) {
            this.name = name;
            this.number = number;
            this.team = team;
            
        }
 
        public String getName() {
            return name;
        }
 
        public int getNumber() {
            return number;
        }
        public String getTeam() {
            return team;
        }
    }
 
    //BaseAdapterを拡張した独自Adapterの定義
    private class ListMemberAdapter extends BaseAdapter {
        private Context context;
        private List list;
 
        public ListMemberAdapter(Context context) {
            super();
            this.context = context;
            //ListにMemberを追加する
            //追加にはMemberクラスを使用
            list = new ArrayList();
            list.add(new Member("Ichiro", 51,"Mariners"));
            list.add(new Member("Matsui", 55,"Rays"));
            list.add(new Member("Darvish", 11,"Rangers"));
        }
 
        public int getCount() {
            return list.size();
        }
 
        public Object getItem(int position) {
 
            return list.get(position);
        }
 
        public long getItemId(int position) {
            return position;
        }
 
        public View getView(int position, View convertView, ViewGroup parent) {
        	Member member = (Member) getItem(position);
 
            
            TextView tvName,tvNumber,tvTeam;
            View v = convertView;

            if(v==null){
              LayoutInflater inflater = 
                (LayoutInflater)
                  getSystemService(Context.LAYOUT_INFLATER_SERVICE);
              v = inflater.inflate(R.layout.list, null);
            }

            if(member != null){
              tvName = (TextView) v.findViewById(R.id.textView1);
              tvNumber = (TextView) v.findViewById(R.id.textView2);
              tvTeam = (TextView) v.findViewById(R.id.textView3);
              
              tvName.setText("Name : "+member.getName());
              tvNumber.setText("Number : "+String.valueOf(member.getNumber()));
              tvTeam.setText("Team : "+member.getTeam());
            }
            return v;
        }
    }
 
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
 
        ListView lv = new ListView(this);
        setContentView(lv);
 
        lv.setAdapter(new ListMemberAdapter(this));
    }
}

これによりレイアウトxmlファイルで1行分のレイアウトを事前に指定し
あとから各表示項目を追記することができます
実行すると以下のような画面になります
device103.png
前回と比較してレイアウトがxmlなので変更が容易にできました

スポンサードリンク

posted by kenken at 16:05 | Comment(0) | TrackBack(0) | ウィジェット トースト | このブログの読者になる | 更新情報をチェックする
2012年04月05日

フォント関連属性を変更する(3)


前回まではフォントスタイルと影を変更しました
textstyleとtypefaceを変更する
フォントの影の設定をする
今回はフォントの幅を変更したいと思います

フォントの横幅を変更する
フォントの幅を変更するには
textScaleX テキストの横方向の拡大率
を使用します
これをそれぞれ1、1.5、2、5と設定した例を示します
main.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="123 abc あいう 指定なし" />

    <TextView
    	android:id="@+id/textView2"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="123 abc あいう 1.0" android:textScaleX="1"/>
    <TextView
    	android:id="@+id/textView3"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="123 abc あいう 1.5" android:textScaleX="1.5"/>

    <TextView
    	android:id="@+id/textView4"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="123 abc あいう 2" android:textScaleX="2"/>
    <TextView
    	android:id="@+id/textView5"
    	android:layout_width="wrap_content"
    	android:layout_height="wrap_content"
    	android:text="123 abc あいう 5" android:textScaleX="5"/>

    
</LinearLayout>
結果は次のようになります
device74.png
フォントの幅が変更されています
5はかなり幅広になってますねww
スポンサードリンク

posted by kenken at 11:05 | Comment(0) | TrackBack(0) | ウィジェット トースト | このブログの読者になる | 更新情報をチェックする
2011年12月27日

トーストの表示


トーストとは・・・
トースト通知とは画面下に一定の時間メッセージ表示されてフェードアウトしていく枠です

トーストを使うと、アプリケーションの状態が変化した事をユーザに通知するためのポップアップWindowにメッセージを表示させる事ができます
ソースコード
package bolg.test;

import android.app.Activity;
import android.os.Bundle;
import android.widget.Toast;

public class TestActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        
        // 第3引数は、表示期間(LENGTH_SHORT、または、LENGTH_LONG)
        Toast.makeText(this, "テスト", Toast.LENGTH_LONG).show();
    }

}
device3.jpg
ここでは『テスト』という文字を表示させています
スポンサードリンク

posted by kenken at 10:37 | Comment(0) | TrackBack(0) | ウィジェット トースト | このブログの読者になる | 更新情報をチェックする