Android基础:视图

一.图片切换器
1.用于保存图像id的数组和图片切换器
private int[] arrayPictures = new int[]{R.mipmap.img01, R.mipmap.img02, R.mipmap.img03,
R.mipmap.img04, R.mipmap.img05, R.mipmap.img06,
R.mipmap.img07, R.mipmap.img08, R.mipmap.img09,
};
private ImageSwitcher imageSwitcher;
2.为图片切换器创建视图工厂
imageSwitcher.setFactory(new ViewSwitcher.ViewFactory(){}
3.在其中的makeview方法中创建一个ImageView用于返回加载
ImageView imageView = new ImageView(MainActivity.this);
imageView.setImageResource(arrayPictures[pictutureIndex]);
return imageView;
4.调用图片动画资源
imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.slide_in_left)); imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.slide_out_right));
java:

import android.app.Activity;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowManager;
import android.view.animation.AnimationUtils;
import android.widget.ImageSwitcher;
import android.widget.ImageView;
import android.widget.ViewSwitcher;

public class MainActivity extends Activity {
    private int[] arrayPictures = new int[]{R.mipmap.img01, R.mipmap.img02, R.mipmap.img03,
            R.mipmap.img04, R.mipmap.img05, R.mipmap.img06,
            R.mipmap.img07, R.mipmap.img08, R.mipmap.img09,
    };// 声明并初始化一个保存要显示图像ID的数组
    private ImageSwitcher imageSwitcher; // 声明一个图像切换器对象
    //要显示的图片在图片数组中的Index
    private int pictutureIndex;
    //左右滑动时手指按下的X坐标
    private float touchDownX;
    //左右滑动时手指松开的X坐标
    private float touchUpX;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
                WindowManager.LayoutParams.FLAG_FULLSCREEN);//设置全屏显示

        imageSwitcher = (ImageSwitcher) findViewById(R.id.imageswitcher); // 获取图像切换器
        //为ImageSwicher设置Factory,用来为ImageSwicher制造ImageView
        imageSwitcher.setFactory(new ViewSwitcher.ViewFactory() {
            @Override
            public View makeView() {
                ImageView imageView = new ImageView(MainActivity.this); // 实例化一个ImageView类的对象
                imageView.setImageResource(arrayPictures[pictutureIndex]);//根据id加载默认显示图片
                return imageView; // 返回imageView对象
            }
        });
        imageSwitcher.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                if (event.getAction() == MotionEvent.ACTION_DOWN) {
                    //取得左右滑动时手指按下的X坐标
                    touchDownX = event.getX();
                    return true;
                } else if (event.getAction() == MotionEvent.ACTION_UP) {
                    //取得左右滑动时手指松开的X坐标
                    touchUpX = event.getX();
                    //从左往右,看下一张
                    if (touchUpX - touchDownX > 100) {
                        //取得当前要看的图片的index
                        pictutureIndex = pictutureIndex == 0 ? arrayPictures.length - 1 : pictutureIndex - 1;
                        //设置图片切换的动画
                        imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.slide_in_left));
                        imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.slide_out_right));
                        //设置当前要看的图片
                        imageSwitcher.setImageResource(arrayPictures[pictutureIndex]);
                        //从右往左,看上一张
                    } else if (touchDownX - touchUpX > 100) {
                        //取得当前要看的图片index
                        pictutureIndex = pictutureIndex == arrayPictures.length - 1 ? 0 : pictutureIndex + 1;
                        //设置切换动画
                        imageSwitcher.setOutAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.slide_out_left));
                        imageSwitcher.setInAnimation(AnimationUtils.loadAnimation(MainActivity.this, R.anim.slide_in_right));
                        //设置要看的图片
                        imageSwitcher.setImageResource(arrayPictures[pictutureIndex]);
                    }
                    return true;
                }
                return false;
            }
        });
    }

}

二.网格视图
1.用于保存图像id的数组和网格视图组件
。。。
GridView gridView= (GridView) findViewById(R.id.gridView);
2.需为组件创建适配器
gridView.setAdapter(new ImageAdapter(this));
3.在getView()方法中创建 ImageView并设置
imageView=new ImageView(mContext);
imageView.setLayoutParams(new GridView.LayoutParams(100, 90));
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
4.获取资源放到ImageView
imageView.setImageResource(picture[position]);
5.返回ImageView
return imageView;
xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context="com.mingrisoft.MainActivity">
<!--标题栏-->
    <ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:src="@mipmap/qqxiang" />
<!--年月日-->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingBottom="10dp"
        android:paddingTop="10dp"
        android:text="2016年1月19号" />
<!--网格布局-->
    <GridView
        android:id="@+id/gridView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnWidth="100dp"
        android:gravity="center"
        android:numColumns="auto_fit"
        android:stretchMode="columnWidth"
        android:verticalSpacing="5dp">

    </GridView>
</LinearLayout>

java:

import android.app.Activity;
import android.content.Context;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.GridView;
import android.widget.ImageView;

public class MainActivity extends Activity {
    //显示的图片数组
    private Integer[] picture = {R.mipmap.img01, R.mipmap.img02, R.mipmap.img03,
            R.mipmap.img04, R.mipmap.img05, R.mipmap.img06, R.mipmap.img07,
            R.mipmap.img08, R.mipmap.img09, R.mipmap.img10, R.mipmap.img11,
            R.mipmap.img12,};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        GridView gridView= (GridView) findViewById(R.id.gridView);  //获取布局文件中的GridView组件
        gridView.setAdapter(new ImageAdapter(this));                //调用ImageAdapter

    }
    //创建ImageAdapter
    public class ImageAdapter extends BaseAdapter{
        private Context mContext;  //获取上下文
        public ImageAdapter(Context c){
            mContext=c;
        }
        @Override
        public int getCount() {
            return picture.length;//图片数组的长度
        }

        @Override
        public Object getItem(int position) {
            return null;
        }

        @Override
        public long getItemId(int position) {
            return 0;
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ImageView imageView;
            if(convertView==null){        //判断传过来的值是否为空
                imageView=new ImageView(mContext);  //创建ImageView组件
                imageView.setLayoutParams(new GridView.LayoutParams(100, 90));   //为组件设置宽高
                imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);        //选择图片铺设方式

            }else{
                imageView= (ImageView) convertView;
            }
            imageView.setImageResource(picture[position]);    //将获取图片放到ImageView组件中
            return imageView; //返回ImageView
        }
    }
}

三.下拉列表框
1.获取下拉列表组件
Spinner spinner = (Spinner) findViewById(R.id.spinner);
2.创建一个适配器使它和选择列表框关联
方法一
String[] ctype=new String[]{“全部”,“电影”,“图书”,“唱片”,“小事”,“用户”,“小组”,“群聊”,“游戏”,“活动”}
ArrayAdapter adapter=new ArrayAdapter(this,android.R.layout.simple_spinner_item,ctype);
方法二
ArrayAdapter adapter = ArrayAdapter.createFromResource(
/this, R.array.ctype,android.R.layout.simple_dropdown_item_1line); //创建一个适配器 adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item); // 为适配器设置列表框下拉时的选项样式
spinner.setAdapter(adapter); // 将适配器与选择列表框关联
3.获取选择项中的值
String result = parent.getItemAtPosition(position).toString();
四.列表视图
1.用于保存图像id的数组和网格视图组件
2.定义并初始化保存列表项文字的数组
3.创建一个list集合
4.通过for循环将图片id和列表项文字放到Map中,并添加到list集合中
5.使用map
6.将map对象添加到List集合中
7.获取选择项的值
java:

import android.app.Activity;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ListView;
import android.widget.SimpleAdapter;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ListView listview = (ListView) findViewById(R.id.listview); // 获取列表视图
        int[] imageId = new int[]{R.mipmap.img01, R.mipmap.img02, R.mipmap.img03,
                R.mipmap.img04, R.mipmap.img05, R.mipmap.img06,
                R.mipmap.img07, R.mipmap.img08, R.mipmap.img09,
        }; // 定义并初始化保存图片id的数组
        String[] title = new String[]{"刘一", "陈二", "张三", "李四", "王五",
                "赵六", "孙七", "周八", "吴九"}; // 定义并初始化保存列表项文字的数组
        List<Map<String, Object>> listItems = new ArrayList<Map<String, Object>>(); // 创建一个list集合
        // 通过for循环将图片id和列表项文字放到Map中,并添加到list集合中
        for (int i = 0; i < imageId.length; i++) {
            Map<String, Object> map = new HashMap<String, Object>(); // 实例化Map对象
            map.put("image", imageId[i]);
            map.put("名字", title[i]);
            listItems.add(map); // 将map对象添加到List集合中
        }
        SimpleAdapter adapter = new SimpleAdapter(this, listItems,
                R.layout.main, new String[] { "名字", "image" }, new int[] {
                R.id.title, R.id.image }); // 创建SimpleAdapter
        listview.setAdapter(adapter); // 将适配器与ListView关联
listview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
        Map<String, Object> map = ( Map<String, Object> )parent.getItemAtPosition(position); 	//获取选择项的值
        Toast.makeText(MainActivity.this,map.get("名字").toString(),Toast.LENGTH_SHORT).show();


    }
});
    }
}

五.选项卡
1.在布局文件中添加Tabhost,TabWigest和TabContent
2.编写各标签页的xml
3.获取并实例TabHost组件
4.为TabHost对象添加标签页
main.xml

<?xml version="1.0" encoding="utf-8"?>
<TabHost
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.mingrisoft.MainActivity">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
        </FrameLayout>
    </LinearLayout>
</TabHost>

tab1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:id="@+id/linearlayout1"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
<ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@mipmap/biaoqing_left"/>
</LinearLayout>

tab2.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:id="@+id/framelayout"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
    <LinearLayout
        android:id="@+id/linearlayout2"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ImageView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@mipmap/biaoqing_right"/>
    </LinearLayout>
</FrameLayout>

java:


import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.widget.TabHost;

public class MainActivity extends AppCompatActivity {
    private TabHost tabHost;//声明TabHost组件的对象

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        tabHost = (TabHost) findViewById(android.R.id.tabhost);//获取TabHost对象
        tabHost.setup();//初始化TabHost组件
        LayoutInflater inflater = LayoutInflater.from(this);    // 声明并实例化一个LayoutInflater对象
        inflater.inflate(R.layout.tab1, tabHost.getTabContentView());
        inflater.inflate(R.layout.tab2,tabHost.getTabContentView());
        tabHost.addTab(tabHost.newTabSpec("tab1")
                .setIndicator("精选表情")
                .setContent(R.id.linearlayout1));//添加第一个标签页
        tabHost.addTab(tabHost.newTabSpec("tab2")
        .setIndicator("投稿表情")
        .setContent(R.id.framelayout));//添加第二个标签页

    }
}

猜你喜欢

转载自blog.csdn.net/qq_37282683/article/details/86528112