工作生活

【Android Demo】QQ登陆界面(三)

2019-07-05  本文已影响0人  感同身受_

当你登陆后,第一眼看到的当然是QQ消息列表啦,那么,我们继QQ登陆界面之后,再写一下QQ列表的相关代码

一、布局:

【效果图】


QQLogin_2.PNG

1、开始贴布局的代码

界面布局second_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#F1F5F2">

    <include layout="@layout/title"/>

    <Button
        android:id="@+id/button2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginRight="20dp"
        android:layout_marginLeft="20dp"
        android:layout_below="@+id/title"
        android:background="@drawable/editview"
        android:text="搜索"/>

    <ListView
        android:id="@+id/recyclerView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/button2"/>

    <include layout="@layout/navigation"/>



</RelativeLayout>
  1. Button按钮是搜索框
  2. ListView是一个listView控件,用于存放消息列表
    (目前用的更多的是RecyclerView,但我还不怎么会使用,所以只有先用着ListView)
  3. 这里使用了引用布局<include layout="@layout/title"/>``<include layout="@layout/navigation"/>这两个布局是对应布局中的标题栏和下面的导航栏。代码:
    标题栏title.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="25dp"
    android:id="@+id/title"
    android:background="#03A3F3"
    android:orientation="horizontal">


    <ImageButton
        android:id="@+id/title_back"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:src="@drawable/img2"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:textSize="22sp"
        android:textColor="#EAEEEA"
        android:text="消息"/>

    <ImageButton
        android:id="@+id/menu"
        android:layout_width="58dp"
        android:layout_height="60dp"
        android:layout_alignParentRight="true"
        android:layout_marginRight="23dp"
        android:src="@drawable/menu"

        />

</RelativeLayout>

导航栏navigation.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:background="#DAD6D6">

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_marginLeft="8dp"
        android:src="@drawable/news"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:src="@drawable/contacts"/>

    <ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_marginRight="8dp"
        android:src="@drawable/space"/>

</RelativeLayout>

现在开始分析代码部分:

(标题栏和导航栏只是做出来了一个效果,具体功能并没有去实现)
(这部分代码主要实现的是如何在ListView中展示消息列表的相应内容,如:联系人网名(备注)、头像、聊天内容、上次对话时间、火花、巨轮等等)

package com.example.qqlogin;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.ListView;
import android.widget.TextView;

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

public class SecondActivity extends Activity {
    private Button button;
    private ListView recyclerView;
    private MyAdapter adapter;
    private List<Map<String,Object>> list;
    private Map<String,Object> map;
    private int[] images = {R.drawable.jia,R.drawable.dachuang,R.drawable.android,R.drawable.he,R.drawable.zeng,R.drawable.jing,
            R.drawable.cao,R.drawable.xu,R.drawable.wang,R.drawable.zheng,R.drawable.yang,R.drawable.zhengyin,R.drawable.li};
    private String[] names = {"菻","android大创小组","安卓小组","何飘","曾祥辉","敬雅兰","曹靖","许昊伟","王志飞","郑淏天","杨龙","郑影","李琰"};
    private int[] relation = {R.drawable.fire,0,0,R.drawable.boat,0,0,0,0,0,R.drawable.fire,0,0,0,};
    private String[] time = {"16:44","15:33","12:03","11:32","7:21","昨天","昨天","昨天","昨天","昨天","昨天","星期五","星期三"};
    private String[] contents = {};

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

        //用代码将状态栏变为透明,而不靠style;
//        if(Build.VERSION.SDK_INT >= 21) {
//            Window window = getWindow();
//            window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
//                    | View.SYSTEM_UI_FLAG_LAYOUT_STABLE);
//            getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);
//            window.setStatusBarColor(Color.TRANSPARENT);
//            //导航栏
//            window.setNavigationBarColor(Color.TRANSPARENT);
//            Log.d("MainActivity","这是第222一一一处");
//        }

        adapterStatus();
        initData();
        initRecyclerView();
        adapter = new MyAdapter();
        recyclerView.setAdapter(adapter);
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent = new Intent(SecondActivity.this, ThirdActivity.class);
                startActivity(intent);
                overridePendingTransition(R.anim.in_from_right,R.anim.out_to_left);
            }
        });

        recyclerView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                Intent intent = new Intent(SecondActivity.this,ChatWindow.class);
                startActivity(intent);
                overridePendingTransition(R.anim.in_from_right,R.anim.out_to_left);
            }
        });
    }

    private void adapterStatus() {
        int height = getStateBar3();
        LinearLayout.LayoutParams layoutParam = new LinearLayout.LayoutParams(
                ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.FILL_PARENT);
        layoutParam.setMargins(10, height, 10, 0);
    }


    private int getStateBar3(){
        int result = 0;
        int resourceId = this.getResources().getIdentifier("status_bar_height", "dimen", "android");
        if (resourceId > 0) {
            result = this.getResources().getDimensionPixelSize(resourceId);
        }
       return result;
    }


    //重写Activity该方法,当窗口焦点变化时自动隐藏system bar,这样可以排除在弹出dialog和menu时,
    //system bar会重新显示的问题。
    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        super.onWindowFocusChanged(hasFocus);
        if (hasFocus) {
            hideSystemUI();
        }
    }

    private void hideSystemUI() {
        Log.d("MainActivity","这是第222二处");
        View decorView = getWindow().getDecorView();
        decorView.setSystemUiVisibility(
                View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY //(修改这个选项,可以设置不同模式)
                        //使用下面三个参数,可以使内容显示在system bar的下面,防止system bar显示或
                        //隐藏时,Activity的大小被resize。
                        | View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                        | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                        | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                        // 隐藏导航栏和状态栏
                        | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
//                        | View.SYSTEM_UI_FLAG_FULLSCREEN
                        );
    }

    //显示system bar, 同时还是希望内容显示在system bar的下方。
    private void showSystemUI() {
        View decorView = getWindow().getDecorView();
        decorView.setSystemUiVisibility(
                View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                        | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                        | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
    }

    private void initRecyclerView() {
        list = new ArrayList<Map<String, Object>>();
        for(int i=0;i<images.length;i++){
            map = new HashMap<String,Object>();
            map.put("img",images[i]);
            map.put("name",names[i]);
//            map.put("content",contents[i]);
            map.put("content","你好,我是"+names[i]);
            map.put("relation",relation[i]);
            map.put("time",time[i]);
            list.add(map);
        }
    }

    private void initData() {
        button = findViewById(R.id.button2);
        recyclerView = findViewById(R.id.recyclerView);

    }

    class MyAdapter extends BaseAdapter{

        @Override
        public int getCount() {
            return list.size();
        }

        @Override
        public Map<String,Object> getItem(int position) {
            return list.get(position);
        }

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

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            Holder holder;
            if(convertView == null){
                convertView = LayoutInflater.from(SecondActivity.this).inflate(R.layout.chatlist_item,null);
                holder = new Holder();
                holder.image = convertView.findViewById(R.id.second_image);
                holder.tvName = convertView.findViewById(R.id.second_name);
                holder.time = convertView.findViewById(R.id.second_time);
                holder.relation = convertView.findViewById(R.id.second_relation);
                holder.tvContent = convertView.findViewById(R.id.second_content);
                convertView.setTag(holder);
            }else{
                holder = (Holder) convertView.getTag();
            }


            holder.tvName.setText((String) list.get(position).get("name"));
            holder.tvContent.setText((String) list.get(position).get("content"));
            holder.time.setText((String) list.get(position).get("time"));
            holder.image.setImageResource( (Integer)list.get(position).get("img"));
            holder.relation.setImageResource( (Integer) list.get(position).get("relation"));
            return convertView;
        }
    }

    class Holder{
        private ImageView image;
        private TextView tvName;
        private TextView tvContent;
        private TextView time;
        private ImageView relation;
    }

    @Override
    public void onBackPressed() {
        finish();
    }
}

  1. 适配器里面有一个有个布局映射器引用了R.layout.chatlist_item
    代码chatlist_item.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#F9F9FC"
    android:padding="12dp"
    >

    <ImageView
        android:id="@+id/second_image"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="11dp"
        android:src="@drawable/yang"/>

    <RelativeLayout
        android:id="@+id/namelist"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/second_image">

        <TextView
            android:id="@+id/second_name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="18sp"
            android:textColor="#00000A"
            android:layout_marginLeft="15dp"
            android:text="杨龙"/>

        <ImageView
            android:id="@+id/second_relation"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toLeftOf="@id/second_time"
            android:layout_marginRight="10dp"
            android:src="@drawable/fire" />

        <TextView
            android:id="@+id/second_time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_marginRight="20dp"
            android:text="15:46"/>

    </RelativeLayout>


    <TextView
        android:id="@+id/second_content"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_toRightOf="@+id/second_image"
        android:layout_below="@+id/namelist"
        android:layout_marginLeft="15dp"
        android:text="你好,我是杨龙"/>

</RelativeLayout>
上一篇下一篇

猜你喜欢

热点阅读