Android笔记(六十九) 仿微信界面（一）

      综合之前的Fragment和自定义组件的知识，实现微信界面

MainActivity.java

package cn.lixyz.test;
 
import android.app.Activity;
import android.os.Bundle;
import android.view.Window;
import android.widget.RadioGroup;
import android.widget.RadioGroup.OnCheckedChangeListener;
import cn.lixyz.test.fragment.DiscoverFragment;
import cn.lixyz.test.fragment.MeFragment;
import cn.lixyz.test.fragment.TXLFragment;
import cn.lixyz.test.fragment.WeChatFragment;
 
public class MainActivity extends Activity implements OnCheckedChangeListener {
 
    private RadioGroup rg_tab_buttons;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        requestWindowFeature(Window.FEATURE_NO_TITLE);
        setContentView(R.layout.activity_main);
 
        getFragmentManager().beginTransaction().add(R.id.layout, new WeChatFragment(), "wechat").commit();
        rg_tab_buttons = (RadioGroup) findViewById(R.id.rg_tab_buttons);
        rg_tab_buttons.setOnCheckedChangeListener(this);
 
    }
 
    @Override
    public void onCheckedChanged(RadioGroup group, int checkedId) {
        switch (checkedId) {
        case R.id.rb_wechat:
            getFragmentManager().beginTransaction().replace(R.id.layout, new WeChatFragment(), "wechat").commit();
            break;
        case R.id.rb_txl:
            getFragmentManager().beginTransaction().replace(R.id.layout, new TXLFragment(), "txl").commit();
            break;
        case R.id.rb_discover:
            getFragmentManager().beginTransaction().replace(R.id.layout, new DiscoverFragment(), "discover").commit();
            break;
        case R.id.rb_me:
            getFragmentManager().beginTransaction().replace(R.id.layout, new MeFragment(), "me").commit();
            break;
        }
    }
 
}

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#f9f9f9"
    android:orientation="vertical" >
 
    <LinearLayout
        android:id="@+id/layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical" >
    </LinearLayout>
 
    <RadioGroup
        android:id="@+id/rg_tab_buttons"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >
 
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />
 
        <RadioButton
            android:id="@+id/rb_wechat"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/wechat_icon"
            android:button="@null" />
 
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />
 
        <RadioButton
            android:id="@+id/rb_txl"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/txl_icon"
            android:button="@null" />
 
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />
 
        <RadioButton
            android:id="@+id/rb_discover"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/discover_icon"
            android:button="@null" />
 
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />
 
        <RadioButton
            android:id="@+id/rb_me"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/me_icon"
            android:button="@null" />
 
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1" />
    </RadioGroup>
 
</LinearLayout>

DiscoverFragment.java

package cn.lixyz.test.fragment;
 
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import cn.lixyz.test.R;
 
public class DiscoverFragment extends Fragment {
 
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        return inflater.inflate(R.layout.discover_fragment, container, false);
    }
 
}

discover_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:custom="http://schemas.android.com/apk/res/cn.lixyz.test"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
 
    <cn.lixyz.test.view.MyCustomTitleBar
        android:layout_width="wrap_content"
        android:layout_height="33dp"
        custom:titleText="发现"
        custom:titleTextColor="#ffffff"
        custom:titleTextSize="5sp" />
 
</LinearLayout>

MeFragment.java

package cn.lixyz.test.fragment;
 
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import cn.lixyz.test.R;
 
public class MeFragment extends Fragment {
 
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        return inflater.inflate(R.layout.me_fragment, container, false);
    }
 
}

me_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:custom="http://schemas.android.com/apk/res/cn.lixyz.test"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
 
    <cn.lixyz.test.view.MyCustomTitleBar
        android:layout_width="wrap_content"
        android:layout_height="33dp"
        custom:titleText="我"
        custom:titleTextColor="#ffffff"
        custom:titleTextSize="5sp" />
 
</LinearLayout>

TXLFragment.java

package cn.lixyz.test.fragment;
 
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import cn.lixyz.test.R;
 
public class TXLFragment extends Fragment {
 
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        return inflater.inflate(R.layout.txl_fragment, container, false);
    }
 
}

txl_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:custom="http://schemas.android.com/apk/res/cn.lixyz.test"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
 
    <cn.lixyz.test.view.MyCustomTitleBar
        android:layout_width="wrap_content"
        android:layout_height="33dp"
        custom:titleButtonImage="@drawable/image"
        custom:titleText="通讯录"
        custom:titleTextColor="#ffffff"
        custom:titleTextSize="5sp"  />
 
</LinearLayout>

WeChatFragment.java

package cn.lixyz.test.fragment;
 
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import cn.lixyz.test.R;
 
public class WeChatFragment extends Fragment {
 
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        return inflater.inflate(R.layout.wechat_fragment, container, false);
    }
 
}

wechat_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:custom="http://schemas.android.com/apk/res/cn.lixyz.test"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
 
    <cn.lixyz.test.view.MyCustomTitleBar
        android:layout_width="wrap_content"
        android:layout_height="33dp"
        custom:titleButtonImage="@drawable/plus"
        custom:titleText="微信"
        custom:titleTextColor="#ffffff"
        custom:titleTextSize="5sp" />
 
</LinearLayout>

MyCustomTitleBar.java

package cn.lixyz.test.view;
 
import android.annotation.SuppressLint;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.View;
import android.widget.ImageButton;
import android.widget.RelativeLayout;
import android.widget.TextView;
import cn.lixyz.test.R;
 
@SuppressLint("NewApi")
public class MyCustomTitleBar extends RelativeLayout {
 
    // 定义自定义控件包含的组件
    private TextView title;
    private ImageButton button;
 
    // 定义控件的属性
    private String titleText;
    private float titleTextSize;
    private int titleTextColor;
    private Drawable titleButtonImage;
 
    // 为每个控件定义LayoutParams
    private LayoutParams textLayoutParams;
    private LayoutParams buttonLayoutParams;
 
    private customTitleBarListener listener;
 
    public interface customTitleBarListener {
        public void click();
    }
 
    public void setCustomTitleBarListener(customTitleBarListener listener) {
        this.listener = listener;
    }
 
    public MyCustomTitleBar(Context context, AttributeSet attrs) {
        super(context, attrs);
 
        // 获取我们定义的属性
        TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.MyCustomTitleBar);
 
        titleText = array.getString(R.styleable.MyCustomTitleBar_titleText);
        titleTextColor = array.getColor(R.styleable.MyCustomTitleBar_titleTextColor, 0);
        titleTextSize = array.getDimension(R.styleable.MyCustomTitleBar_titleTextSize, 10);
        titleButtonImage = array.getDrawable(R.styleable.MyCustomTitleBar_titleButtonImage);
 
        // 回收，以防出错
        array.recycle();
 
        // 新建包含的子组件
        title = new TextView(context);
        button = new ImageButton(context);
 
        // 为子组件赋值
        title.setText(titleText);
        title.setTextColor(titleTextColor);
        title.setTextSize(titleTextSize);
        button.setBackground(titleButtonImage);
 
        // 设置背景色
        setBackgroundColor(0xFF38373c);
 
        // 设置包含控件的属性并添加到view中
        textLayoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        textLayoutParams.addRule(RelativeLayout.CENTER_IN_PARENT);
        addView(title, textLayoutParams);
        buttonLayoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        buttonLayoutParams.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
        addView(button, buttonLayoutParams);
 
        button.setOnClickListener(new View.OnClickListener() {
 
            @Override
            public void onClick(View v) {
                listener.click();
            }
        });
 
    }
}

attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
 
    <declare-styleable name="MyCustomTitleBar">
        <attr name="titleText" format="string" />
        <attr name="titleTextSize" format="dimension" />
        <attr name="titleTextColor" format="color" />
        <attr name="titleButtonImage" format="reference" />
    </declare-styleable>
 
</resources>