android自定义view、viewgroup、复合组件-实现底部菜单（1）

最新推荐文章于 2024-09-30 11:32:01 发布

chiyingliao3565

最新推荐文章于 2024-09-30 11:32:01 发布

阅读量126

点赞数

文章标签：移动开发 java ui

原文链接：https://my.oschina.net/moziqi/blog/530998

版权

本文侧重写纯java代码，用xml配置文件，自己稍微做修改

自定义红点的imageview

RedTipImageView.java

import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.widget.ImageView;

import com.youapp.app.R;

/**
 * Created by moziqi on 2015/11/12.
 * 小红点
 */
public class RedTipImageView extends ImageView implements GeneralView {
    private int tipVisibility = 0;
    private TipType mTipType = TipType.RED_TIP_INVISIBLE;

    public RedTipImageView(Context context) {
        this(context, null, 0);
    }

    public RedTipImageView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public RedTipImageView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs);
    }

    @Override
    public void init(Context context) {

    }

    /**
     * 利用配置文件操作
     *
     * @param context
     * @param attrs
     */
    @Override
    public void init(Context context, AttributeSet attrs) {
        if (attrs != null) {
            TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.RedTipImageView);
            tipVisibility = typedArray.getInt(R.styleable.RedTipImageView_redTipsVisibility, 0);
            typedArray.recycle();
        }
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (tipVisibility == TipType.RED_TIP_VISIBLE.getCode() || mTipType == TipType.RED_TIP_VISIBLE) {
            int width = getWidth();
            int y = 10;
            Paint paint = new Paint();
            paint.setColor(Color.RED);
            paint.setAntiAlias(false);
            paint.setDither(true);
            paint.setStyle(Paint.Style.FILL_AND_STROKE);
            canvas.drawCircle(width - y, y, y / 2, paint);
        }
    }

    public void setTipVisibility(int visibility) {
        tipVisibility = visibility;
        invalidate();
    }

    public void setTipVisibility(TipType tipType) {
        if (tipType == null) {
            throw new NullPointerException();
        }
        this.mTipType = tipType;
        invalidate();
    }

    /**
     * 红点类型
     */
    public enum TipType {
        RED_TIP_INVISIBLE(0),//不显示
        RED_TIP_VISIBLE(1),//显示
        RED_TIP_GONE(2);//不显示
        private int code;

        TipType(int code) {
            this.code = code;
        }

        public int getCode() {
            return code;
        }
    }
}

attrs.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <declare-styleable name="RedTipImageView">
        <attr name="redTipsVisibility">
            <enum name="invisible" value="0"></enum>
            <enum name="visible" value="1"></enum>
            <enum name="gone" value="2"></enum>
        </attr>
    </declare-styleable>
</resources>

定义底部的item复合组件

BottomItemView.java

import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.drawable.Drawable;
import android.util.AttributeSet;
import android.view.Gravity;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.youapp.app.R;

/**
 * Created by moziqi on 2015/11/12.
 * 定义底部菜单item
 */
public class BottomItemView extends LinearLayout implements GeneralView {

    private Context mContext;
    private RedTipImageView mRedTipImageView;
    private TextView mTextView;

    //判断当前是否有焦点
    private boolean isFocusable = false;

    public int focusableResId;
    public int unFocusableResId;

    public BottomItemView(Context context) {
        this(context, null, 0);
    }

    public BottomItemView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public BottomItemView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        //2个init都可以使用，看个人喜欢
        init(context, attrs);
        //图片自适应拉伸
        mRedTipImageView.setScaleType(ImageView.ScaleType.FIT_XY);
        //取消事件触发
        mRedTipImageView.setFocusable(false);
        mRedTipImageView.setClickable(false);
        mTextView.setFocusable(false);
        mTextView.setClickable(false);
    }


    /**
     * 纯代码实现
     *
     * @param context
     */
    @Override
    public void init(Context context) {
        mContext = context;
        setOrientation(VERTICAL);
        mRedTipImageView = new RedTipImageView(mContext);
        mTextView = new TextView(mContext);
        LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        layoutParams.gravity = Gravity.CENTER;
        addView(mTextView, layoutParams);
        //设置外边距
        //mRedTipImageView.setLayoutParams(layoutParams);
        layoutParams.setMargins(10, 10, 10, 10);
        mRedTipImageView.setLayoutParams(layoutParams);
        addView(mRedTipImageView, layoutParams);
    }

    /**
     * 使用xml配置文件
     *
     * @param context
     */
    @Override
    public void init(Context context, AttributeSet attrs) {
        mContext = context;
        LayoutInflater mLayoutInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        View rootView = mLayoutInflater.inflate(R.layout.view_bottom_item, this);
        mRedTipImageView = (RedTipImageView) rootView.findViewById(R.id.iv_view_bottom_item);
        mTextView = (TextView) rootView.findViewById(R.id.tv_view_bottom_item);
    }

    public void setViewFocusable(boolean isFocusable) {
        this.isFocusable = isFocusable;
    }

    /**
     * 设置Drawable类型
     *
     * @param focusableDrawable
     * @param unFocusableDrawable
     */
    public void setIcon(Drawable focusableDrawable, Drawable unFocusableDrawable) {
        if (isFocusable) {
            setIcon(focusableDrawable);
        } else {
            setIcon(unFocusableDrawable);
        }
    }

    /**
     * 设置ResId
     * BottomView使用id
     *
     * @param focusableResId
     * @param unFocusableResId
     */
    public void setIcon(int focusableResId, int unFocusableResId) {
        this.focusableResId = focusableResId;
        this.unFocusableResId = unFocusableResId;
        if (isFocusable) {
            setIcon(focusableResId);
        } else {
            setIcon(unFocusableResId);
        }
    }

    /**
     * 设置Bitmap类型
     *
     * @param focusableBitmap
     * @param unFocusableBitmap
     */
    public void setIcon(Bitmap focusableBitmap, Bitmap unFocusableBitmap) {
        if (isFocusable) {
            setIcon(focusableBitmap);
        } else {
            setIcon(unFocusableBitmap);
        }
    }

    public void setIcon(Drawable drawable) {
        mRedTipImageView.setImageDrawable(drawable);
    }

    public void setIcon(int resId) {
        if (focusableResId == resId) {
            //TODO 设置字体颜色
            mTextView.setTextColor(Color.BLUE);
        } else {
            mTextView.setTextColor(Color.GRAY);
        }
        mRedTipImageView.setImageResource(resId);
    }

    public void setIcon(Bitmap bitmap) {
        mRedTipImageView.setImageBitmap(bitmap);
    }

    /**
     * 设置红点提示
     *
     * @param tipType
     */
    public void setTipVisibility(RedTipImageView.TipType tipType) {
        mRedTipImageView.setTipVisibility(tipType);
    }

    /**
     * 设置文字
     *
     * @param text
     */
    public void setText(String text) {
        mTextView.setText(text);
    }

    /**
     * 设置文字
     *
     * @param resId
     */
    public void setText(int resId) {
        mTextView.setText(resId);
    }

}

view_bottom_item.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="wrap_content"
android:orientation="vertical">

<com.youapp.ui.RedTipImageView
    android:id="@+id/iv_view_bottom_item"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center" />

<TextView
    android:id="@+id/tv_view_bottom_item"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center" />
</LinearLayout>

BottomView.java

import android.content.Context;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.widget.LinearLayout;

import java.util.ArrayList;
import java.util.List;

/**
 * Created by moziqi on 2015/11/17.
 */
public class BottomView extends LinearLayout implements GeneralView, View.OnClickListener {
    private final static String TAG = "BottomView";
    private Context mContext;
    private AttributeSet mAttrs;
    private OnItemClickListener listener;
    private List<Integer> ids;

    public BottomView(Context context) {
        this(context, null, 0);
    }

    public BottomView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public BottomView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init(context, attrs);
        ids = new ArrayList<>();
    }

    @Override
    public void init(Context context) {

    }

    @Override
    public void init(Context context, AttributeSet attrs) {
        mContext = context;
        mAttrs = attrs;
        setOrientation(HORIZONTAL);
    }


    public BottomView addBottomView(int title, int focusableResId, int unFocusableResId) {
        addBottomView(title, focusableResId, unFocusableResId, false);
        return this;
    }

    public BottomView addBottomView(int title, final int focusableResId, final int unFocusableResId, final boolean focusable) {
        BottomItemView bottomItemView = new BottomItemView(mContext, mAttrs);
        LayoutParams layoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
        layoutParams.weight = 1;
        bottomItemView.setText(title);
        //设置id
        bottomItemView.setId(focusableResId);
        ids.add(focusableResId);
        bottomItemView.setViewFocusable(focusable);
        bottomItemView.setIcon(focusableResId, unFocusableResId);
        bottomItemView.setOnClickListener(this);
        addView(bottomItemView, layoutParams);
        return this;
    }

    @Override
    public void onClick(View v) {
        //TODO 这里可能会比较耗时，博主是菜鸟，用途是判断当前点击那一个
        for (int i = 0; i < ids.size(); i++) {
            BottomItemView childAt = (BottomItemView) getChildAt(i);
            if (ids.get(i) == v.getId()) {
                childAt.setIcon(childAt.focusableResId);
                if (listener != null) {
                    //回调
                    listener.onItemClick(i);
                    Log.e(TAG, "current id is " + i);
                }
            } else {
                childAt.setIcon(childAt.unFocusableResId);
            }
        }
    }

    /**
     * 设置底部菜单是否有消息推送过来，存在就显示红点
     *
     * @param position
     * @param tipType
     */
    public void setPositionRedTip(int position, RedTipImageView.TipType tipType) {
        BottomItemView childAt = (BottomItemView) getChildAt(position);
        childAt.setTipVisibility(tipType);
    }

    public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
        listener = onItemClickListener;
    }

    public interface OnItemClickListener {

        void onItemClick(int position);
    }
}

装载请表明来之http://my.oschina.net/moziqi/blog/530998

转载于:https://my.oschina.net/moziqi/blog/530998