zoukankan      html  css  js  c++  java
  • Android自定义控件简单实现ratingbar效果

    先上图:
    一开始让我自定义控件我是拒绝的,因为android很早以前就有一个控件ratingbar,但是设置样式的时候我发现把图片设置小一点就显示不全,一直找不到解办法!(可以设置系统的自带的小样式),反正就是无法任意的改变星星的大小!反正很坑啊。
    下面来描述这个控件需要实现的功能:
    1:水平放置,布局文件里面可以设置星星图标和背景星星,宽高,边距,星星数量,当前星级
    2;实现点击效果
    3:添加点击的监听器
    下面实现第一步:
    定义属性
    <!--自定星级控件-->
    <declare-styleable name="StarView">
        <attr name="mImageWidth" format="dimension"/>
        <attr name="mImageHeight" format="dimension" />
        <attr name="mDefaultImageId" format="reference" />
        <attr name="mClickImageId" format="reference" />
        <attr name="mMargin" format="dimension" />
        <attr name="mStarNum" format="integer" />
        <attr name="mStarChoose" format="integer" />
    </declare-styleable>

    本控件继承线性布局的starbar,代码过于简单,直接贴出来

    package cn.ihealthcom.ihealth.widget;
    
    import android.content.Context;
    import android.content.res.TypedArray;
    import android.util.AttributeSet;
    import android.view.View;
    import android.widget.ImageView;
    import android.widget.LinearLayout;
    
    import cn.ihealthcom.ihealth.R;
    
    /**
     * 简单实现星级评选控件:内部填充多个ImageView
     * 继承LinearLayout 设置水平方向
     * Created by qiuchunjia on 2016/4/12.
     */
    public class StarView extends LinearLayout {
        private int mImageWidth = 20;  //图片设置默认的宽度
        private int mImageHeight = 20; //图片设置默认的高度
        private int mDefaultImageId = R.drawable.ic_launcher;
        private int mClickImageId = R.drawable.ic_launcher;
        private int mMargin = 5;   //图片之间默认的margin
        private int mStarNum = 5;  //星星默认的个数
        private int mStarChoose = 3;  //默认默认是三颗星
        private boolean isClick = true;
    
        private OnStarItemClickListener mStarItemClickListener;
    
        public StarView(Context context, AttributeSet attrs) {
            super(context, attrs);
            initData(context, attrs);
        }
    
        public StarView(Context context, AttributeSet attrs, int defStyleAttr) {
            super(context, attrs, defStyleAttr);
            initData(context, attrs);
        }
    
        /**
         * 初始化数据
         *
         * @param context
         * @param attrs
         */
        private void initData(Context context, AttributeSet attrs) {
            this.setOrientation(HORIZONTAL);  //设置水平
            TypedArray a = context.getTheme().obtainStyledAttributes(attrs,
                    R.styleable.StarView, 0, 0);
            int n = a.getIndexCount();
    
            for (int i = 0; i < n; i++) {
                int attr = a.getIndex(i);
                switch (attr) {
                    case R.styleable.StarView_mImageWidth:
                        mImageWidth = (int) a.getDimension(attr, mImageWidth);
                        break;
                    case R.styleable.StarView_mImageHeight:
                        mImageHeight = (int) a.getDimension(attr, mImageHeight);
                        break;
                    case R.styleable.StarView_mDefaultImageId:
                        mDefaultImageId = a.getResourceId(attr, mDefaultImageId);
                        break;
                    case R.styleable.StarView_mClickImageId:
                        mClickImageId = a.getResourceId(attr, mClickImageId);
                        break;
                    case R.styleable.StarView_mMargin:
                        mMargin = (int) a.getDimension(attr, mMargin);
                        break;
                    case R.styleable.StarView_mStarNum:
                        mStarNum = a.getInt(attr, mStarNum);
                        break;
                    case R.styleable.StarView_mStarChoose:
                        mStarChoose = a.getInt(attr, mStarChoose);
                        break;
                }
            }
            a.recycle();
    
        }
    
        @Override
        protected void onFinishInflate() {
            super.onFinishInflate();
            setStarNum(mStarNum);  //设置个数
        }
    
        /**
         * 设置星星数量
         *
         * @param number
         */
        public void setStarNum(int number) {
            if (number <= 0) {
                try {
                    throw new Exception("设置的数据不能小于等于零");
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
            this.removeAllViews(); //清空所有view
            for (int i = 0; i < number; i++) {
                ImageView imageView = new ImageView(getContext());
                final LinearLayout.LayoutParams layoutParams = new LinearLayout.LayoutParams(mImageWidth, mImageHeight);
                layoutParams.leftMargin = mMargin;
                layoutParams.rightMargin = mMargin;
                imageView.setLayoutParams(layoutParams);
                this.addView(imageView);
                imageView.setImageResource(mDefaultImageId);
                setStarOnClick(imageView, i);
            }
            setCurrentChoose(mStarChoose);  //设置当前选择
        }
    
    
        /**
         * 设置点击事件
         *
         * @param imageView
         * @param i
         */
        private void setStarOnClick(final ImageView imageView, final int i) {
            if (imageView != null) {
                imageView.setOnClickListener(new OnClickListener() {
                    @Override
                    public void onClick(View view) {
                        resetDefaultImage();
                        setCurrentChoose(i+1);
                        if (mStarItemClickListener != null) {
                            mStarItemClickListener.onItemClick(imageView, i);
                        }
                    }
                });
            }
        }
    
        /**
         * 设置当前选择
         *
         * @param index
         */
        private void setCurrentChoose(int index) {
            if(isClick){
                for (int i = 0; i < index; i++) {
                    ImageView imageView = (ImageView) getChildAt(i);
                    imageView.setImageResource(mClickImageId);
                }
            }
        }
    
        /**
         * 重置默认为默认的图片
         */
        private void resetDefaultImage() {
            int cNum = getChildCount();
            for (int i = 0; i < cNum; i++) {
                ImageView imageView = (ImageView) getChildAt(i);
                imageView.setImageResource(mDefaultImageId);
            }
        }
    
        public int getImageWidth() {
            return mImageWidth;
        }
    
        public void setImageWidth(int mImageWidht) {
            this.mImageWidth = mImageWidht;
        }
    
        public int getImageHeight() {
            return mImageHeight;
        }
    
        public void setImageHeight(int mImageHeight) {
            this.mImageHeight = mImageHeight;
        }
    
        public int getDefaultImageId() {
            return mDefaultImageId;
        }
    
        public void setDefaultImageId(int resouceId) {
            this.mDefaultImageId = mDefaultImageId;
        }
    
        public int getClickImageId() {
            return mClickImageId;
        }
    
        public void setClickImageId(int mClickImageId) {
            this.mClickImageId = mClickImageId;
        }
    
        public OnStarItemClickListener getStarItemClickListener() {
            return mStarItemClickListener;
        }
    
        public void setmStarItemClickListener(OnStarItemClickListener mStarItemClickListener) {
            this.mStarItemClickListener = mStarItemClickListener;
        }
    
        /**
         * 星星点击事件
         */
        public interface OnStarItemClickListener {
            public void onItemClick(View view, int pos);
        }
    
    
    }

    代码中只实现了ratingbar常用的功能,能满足项目的需求.xml使用

    <cn.ihealthcom.ihealth.widget.StarView
        android:layout_alignParentRight="true"
        android:layout_marginLeft="5dp"
        android:layout_marginRight="10dp"
        android:id="@+id/start_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        fresco:mClickImageId="@mipmap/star_y"
        fresco:mDefaultImageId="@mipmap/star_n"
        fresco:mImageHeight="@dimen/margin_15dp"
        fresco:mImageWidth="@dimen/margin_15dp"
        fresco:mMargin="2dp"
        fresco:mStarChoose="3"
        fresco:mStarNum="5" />
    下面来看看同一张切图的设置不同的宽高显示的效果
    代码和功能都比较简单就不做过多的解释了
  • 相关阅读:
    几个生僻字:烎,囧、槑、玊、奣、嘦、勥、巭、嫑、恏、兲、氼、忈、炛
    移动互联网相关应用网站
    Android 布局简要范例
    参与了一次体验不好的产品体验
    ros6.44版本增加了测试出两台ROS之间的速度极限是多少
    mikrotik ros CVE-2019–3924 DUDE AGENT VULNERABILITY
    如何获取阿里云OSS上每个文件夹的大小
    USB-IF协会公布最新PD3.0(PPS)协议认证芯片和产品名单
    第一次有人把小米9快充讲的这么简单明了qc3.0 usb pd
    查看手机拍照性能排名以及电池排名的两个网站
  • 原文地址:https://www.cnblogs.com/zhujiabin/p/7301823.html
Copyright © 2011-2022 走看看