android menu界面 android ui界面

Android 应用的界面编程

• [1]TextView 文本框
• [2]EditText 编辑框
• [3]Button 按钮(简单总结)
• [4]RadioButton单选钮
• [5]CheckBox 复选框
• [6]DataPicker 日期选择器
• [7]TimePicker 时间选择器
• [8]Chronometer 计时器
• [9] ProgressBar 进度条
• [10]SeekBar 拖动条
• [11]RatingBar 星级评分条
• [12]ImageView 图像视图
• [13] ImageSwitcher需要两步实现:
• [14]GridView 网格视图
• [15]SimpleAdapter 它有5个参数
• [16]BaseAdapter
• [17]Spinner 下拉列表框
• [18]ListView 列表视图
• RecyclerView
• [19]ScrollView 滚动视图
• [20]TabHost 选项卡

[1]TextView 文本框

直接继承View.较简单

[2]EditText 编辑框

• hint —提示文字
• inputType --需要的类型
• drawableLeft ----图像资源 (与drawableStart相同)
• drawablePadding–调节图像与文字间距,
• lines --设置行数
• getText()方法–获取编辑框文本

[3]Button 按钮(简单总结)

设置监听器方式

• a.匿名内部类方式
• b.onClick方法

ImageButton按钮中添加的图片上有灰底的,可以通过background="#0000"来去除

9-Patch图片前提是必须存储为PNG-24

[4]RadioButton单选钮

• RadioGroup把RadioButton括起来之后组成单选按钮组
• 监听器: setCheckedChangeListener 来实现
• getText()方法获取值

[5]CheckBox 复选框

[6]DataPicker 日期选择器

{
 OnDateChangedListener
 }

[7]TimePicker 时间选择器

{
 OnTimeChangedListener
 setIs24HourView(true) 改为24制式
 }

[8]Chronometer 计时器

实现分5步:

1. setBase() --设置计时器的起始时间
2. setFormat() --设置显示时间的格式
3. start() --指定开始计时
4. stop() --指定停止计时
5. setOnChronometerTickListener() --为计时器绑定事件监听器,当计时器改变时触发该监听器
   关键代码:

//获取我们关心的组件
ch = (Chronometer)findViewById(R.id.test);
start = (Button)findViewById(R.id.start);

start.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        ch.setBase(SystemClock.elapsedRealtime());//设置计时时间
        ch.start();
        start.setEnabled(false);
    }
});
//邦定时间监听20秒
ch.setOnChronometerTickListener(new Chronometer.OnChronometerTickListener() {
    @Override
    public void onChronometerTick(Chronometer chronometer) {
        if(SystemClock.elapsedRealtime()-ch.getBase()>20*1000){
            ch.stop();
            start.setEnabled(true);
        }
    }
});

[9] ProgressBar 进度条

• max — 最大进度
• progress —当前进度
• setProgress()方法 —更新进度
• setVisibility() —设置进度条不显示

[10]SeekBar 拖动条

• max — 最大进度
• progress —当前进度
• thumb 拖动的手柄图标
• setOnSeekBarChangeListener --拖动监听器

[11]RatingBar 星级评分条

• numStars :设置多少颗星
• rating:默认点亮多少颗星
• stepSize:步进值
• idIndicator:设为true不可更改

[12]ImageView 图像视图

1. src:指定图片
2. scaleType: 缩放 {center:居中不缩放 ,fitcenter:居中缩放 ,centercrop:不等比居中缩放,fitxy:不等比裁剪缩放,centerinside:只缩小不放大居中 }
3. adjustViewBounds:是否更改长宽比
4. maxWidth:最大宽度
5. maxHight:最大高度
6. tint:着色,为图像可以设置半透明着色

[13] ImageSwitcher需要两步实现:

A.为ImageSwitcher提供一个ViewFactory,该ViewFactory生成的View必须是
ImageView
B:需要切换图片时,只要调用ImageSwitcher的

• setImageDrawable(Drawable drawable),
• setImageResource(int resid),
• setImageURI(Uri uri)
  用这三种其中一种方法更换图片即可

切换动画的话:

• is.setInAnimation(AnimationUtils.loadAnimation(MainActivity.this,R.anim.slide_in_left)
• setOutAnimationAnimationUtils.loadAnimation(MainActivity.this,R.anim.slide_out_right)

[14]GridView 网格视图

• numColumn: 排列
• grivity:排列位置
• columnWidth:列宽

[15]SimpleAdapter 它有5个参数

1. 上下文对象this
2. 一个List集合:List<Map<String,Object>>
3. 指定一个界面布局的ID:R.layout.simple_item
4. Map中哪些键对应的value
5. 布局文件中的组件ID

关键代码

protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        GridView gridView = findViewById(R.id.gridView);
        //设置simpleAdapter中的参数
        List<Map<String,Object>> listItem = new ArrayList<Map<String, Object>>();
        //通过for循环把数组中的元素添加到List中
        for(int i =0;i<picture.length;i++){
            Map<String,Object> map =new HashMap<>();
            map.put("image",picture[i]);
            listItem.add(map);
        }
        //创建simpleAdapter对象
        SimpleAdapter simpleAdapter = new SimpleAdapter(this,listItem,R.layout.cell,
                new String[]{"image"},new int[]{R.id.image});
        gridView.setAdapter(simpleAdapter);
    }
}

[16]BaseAdapter

//创建一个类,继承BaseAdapter
 //定义ImageAdapter类
    public class ImageAdapter extends BaseAdapter{

        private Context mContext;

        public ImageAdapter(Context mContext) {
            this.mContext = mContext;
        }

        @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;
            //判断传过来的convertView是否为空,是的话创建
            if(convertView==null){
                imageView = new ImageView(mContext);
                //设置新生成的ImageView的长宽
                imageView.setLayoutParams(new GridView.LayoutParams(1400,1800));
                //设置缩放(保持纵横比缩放
                imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
            }else{ //如果传递过来的imageView不为空,把传过来的给imageView
                imageView =(ImageView)convertView;
            }
            imageView.setImageResource(picture[position]);
            return imageView;
        }
    }

[17]Spinner 下拉列表框

第一种方式 entries:设置列表框内容

第二种方式 利用适配器ArrayAdapter

• 需要设定数组资源
• ArrayAdapter adapter = new ArrayAdapter(this,android.r.layout.simple_spinner)
• adapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item)
• 找到Spinner对象
• setAdapter(adapter);

[18]ListView 列表视图

public class MainActivity extends AppCompatActivity {

    private int[] images ={
            R.mipmap.q3,R.mipmap.q1,R.mipmap.q2,
            R.mipmap.q1,R.mipmap.q3,R.mipmap.q1,
            R.mipmap.q2,R.mipmap.q3
    };
    private  String[] title =new String[]{
            "刘一","张三","李四","王麻子","李成","大三","唐伯虎","罗四"
    };
    private ListView lv;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        lv = findViewById(R.id.listview);

        List<Map<String,Object>> listItem = new ArrayList<Map<String, Object>>();
        //定义一个list分别把图标和名称放入
        for(int i=0;i<images.length;i++){
            Map<String, Object> map = new HashMap<String, Object>();
            map.put("image",images[i] );
            map.put("name",title[i]);
            listItem.add(map);
        }
        SimpleAdapter simpleAdapter =new SimpleAdapter(this,listItem,R.layout.main,new String[]{"image","name"},
                new int [] {R.id.image,R.id.title});
        lv.setAdapter(simpleAdapter);

        lv.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("name").toString(),
                        Toast.LENGTH_LONG).show();
            }
        });
    }
}

RecyclerView

1.添加依赖库
dependencies { ... implementation 'com.android.support:recyclerview-v7:28.0.0' } 2.编写主界面

?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#d8e0e8"
    tools:context=".MainActivity">
    
    <android.support.v7.widget.RecyclerView
        android:id="@+id/msg_recycler_view"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"></android.support.v7.widget.RecyclerView>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <EditText
            android:id="@+id/input_text"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:maxLines="2"
            android:hint="Type something here"/>
        <Button
            android:id="@+id/send"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textAllCaps="false"
            android:text="Send"/>
    </LinearLayout>

</LinearLayout>

3.编写消息类Msg

//定义一个消息的实体类
public class Msg {
    //表示这是一条收到的消息
    public static final int TYPE_RECEIVED =0;
    //表示这是一条发送的消息
    public static final int TYPE_SENT=1;
    private String content;  //消息内容
    private int type;  //消息类型

    public Msg(String content, int type) {
        this.content = content;
        this.type = type;
    }

    public String getContent() {
        return content;
    }

    public int getType() {
        return type;
    }
}

4.编写RecyclerView的子项布局

<!--RecyclerView的子项布局-->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="10dp">

    <LinearLayout
        android:id="@+id/left_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="left"
        android:background="@drawable/dialog">
        <TextView
            android:id="@+id/left_msg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_margin="10dp"
            android:textSize="20sp"
            android:textColor="#fff"/>
    </LinearLayout>
    <LinearLayout
        android:id="@+id/right_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:background="@drawable/dialog">
        <TextView
            android:id="@+id/right_msg"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_margin="10dp"
            android:textSize="20sp"
            android:textColor="#000"/>
    </LinearLayout>

</LinearLayout>

5.RecyclerView的适配器类 MsgAdapter

public class MsgAdapter extends RecyclerView.Adapter<MsgAdapter.ViewHoler> {
    private List<Msg> mMsgList;
    static class ViewHoler extends RecyclerView.ViewHolder{
        LinearLayout leftLayout;
        LinearLayout rightLayout;
        TextView leftMsg;
        TextView rightMsg;

        public ViewHoler(View view) {
            super(view);
            leftLayout = (LinearLayout)view.findViewById(R.id.left_layout);
            leftMsg = (TextView)view.findViewById(R.id.left_msg);
            rightLayout = (LinearLayout) view.findViewById(R.id.right_layout);
            rightMsg = (TextView) view.findViewById(R.id.right_msg);

        }
    }
public MsgAdapter(List<Msg> msgList){
        mMsgList=msgList;
}

    @Override
    public ViewHoler onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate
                (R.layout.msg_item,parent,false);
        return new ViewHoler(view);
    }

    @Override
    public void onBindViewHolder(@NonNull ViewHoler holder, int position) {
        Msg msg = mMsgList.get(position);
        if(msg.getType()==msg.TYPE_RECEIVED){
            //如果是收到的消息,,则显示左边的消息布局,将右边的布局隐藏
            holder.leftLayout.setVisibility(View.VISIBLE);
            holder.rightLayout.setVisibility(View.GONE);
            holder.leftMsg.setText(msg.getContent());
        }else if(msg.getType()==Msg.TYPE_SENT){
            //如果是发出的消息,则显示右边的消息布局,将左边的消息布局隐藏
            holder.rightLayout.setVisibility(View.VISIBLE);
            holder.leftLayout.setVisibility(View.GONE);
            holder.rightMsg.setText(msg.getContent());
        }
    }

    @Override
    public int getItemCount() {
        return mMsgList.size();
    }


}

6.主程序中:

public class MainActivity extends AppCompatActivity {
private List<Msg> msgList =new ArrayList<>();

private EditText inputText;
private Button send;
private RecyclerView msgRecyclerView;
private MsgAdapter adapter;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //初始化消息数据
        initMsgs();
        send =findViewById(R.id.send);
        inputText= findViewById(R.id.input_text);
        msgRecyclerView = findViewById(R.id.msg_recycler_view);
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        msgRecyclerView.setLayoutManager(layoutManager);
        adapter=new MsgAdapter(msgList);
        msgRecyclerView.setAdapter(adapter);
        send.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                String content = inputText.getText().toString();
                if(!"".equals(content)){
                    Msg msg=new Msg(content,Msg.TYPE_SENT);
                    msgList.add(msg);
                    //当有新消息时,刷新ListView中的显示
                    adapter.notifyItemInserted(msgList.size()-1);
                    //将ListView定位到最后一行
                    msgRecyclerView.scrollToPosition(msgList.size()-1);
                    inputText.setText("");
                }
            }
        });
    }
    private void initMsgs(){
        Msg msg1 = new Msg("Hello guy.",Msg.TYPE_RECEIVED);
        msgList.add(msg1);
        Msg msg2 = new Msg("Hello,Who is that?",Msg.TYPE_SENT);
        msgList.add(msg2);
        Msg msg3 = new Msg("This is Tim,Nice talking to you.",Msg.TYPE_RECEIVED);
        msgList.add(msg3);

    }
}

[19]ScrollView 滚动视图

1. 1种是在XML文件中添加
2. 2种是在java中实现

[20]TabHost 选项卡

TabHost的Id 必须是android预定义的ID @android:

关键代码

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
    <TabWidget
        android:id="@android:id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"></TabWidget>
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:id="@android:id/tabcontent"></FrameLayout>

    </LinearLayout>

</TabHost>
代码文件
TabHost tabHost = findViewById(android.R.id.tabhost);
//tabhost需要初始化
tabHost.setup();
//初始化完成后添加标签页
LayoutInflater layoutInflater = LayoutInflater.from(this);
layoutInflater.inflate(R.layout.tab1,tabHost.getTabContentView());
layoutInflater.inflate(R.layout.tab2,tabHost.getTabContentView());
//添加标签页
tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("精选表情").setContent(R.id.left));
tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("投稿表情").setContent(R.id.right));