第二章控件架构与自定义控件详解 + ListView使用技巧 + Scroll分析

1.Android控件架构
下图是UI界面架构图，每个Activity都有一个Window对象，通常是由PhoneWindow类来实现的。
PhoneWindow将DecorView作为整个应用窗口的根View，DecorView将屏幕分成两部分：TitleView和ContentView。
ContentView实际上是一个FrameLayout，里面容纳的就是我们在xml布局文件中定义的布局。

为什么调用requestWindowFeature()方法一定要在setContentView()方法调用之前？
当程序在onCreate()方法中调用setContentView()方法后，ActivityManagerService会回调onResume()方法，此时系统才会将整个DecorView添加到PhoneWindow中，并让其显示出来，从而完成界面的绘制。

2.View的测量：MeasureSpec和测量模式
MeasureSpec是一个32位的int值，其中高2位是测量的模式，低30位是测量的大小（使用位运算是为了提高效率和节省空间）
测量模式有三种：
(1)EXACTLY：精确值模式，属性设置为精确数值或者match_parent时，系统使用的是EXACTLY模式
(2)AT_MOST：最大值模式，属性设置为wrap_content时，系统使用的是AT_MOST模式
(3)UNSPECIFIED：不指定大小测量模式，通常情况下在绘制自定义View时才会用到

View类默认的onMeasure()方法只支持EXACTLY模式，所以如果在自定义View的时候不重写onMeasure方法的话，就只能使用EXACTLY模式。自定义View可以响应你指定的具体的宽高值或者是match_parent属性，但是，如果要让自定义View支持wrap_content属性的话，那么就必须要重写onMeasure方法来指定wrap_content时view的大小。

重写onMeasure方法的最终工作就是把测量后的宽高值作为参数设置给setMeasuredDimension方法。

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    //计算width和height
    setMeasuredDimension(width, height);
}

3.View和ViewGroup的绘制
View的onDraw()方法包含一个参数Canvas对象，使用这个Canvas对象就可以进行绘图了。

通常情况下，Canvas对象的创建需要传入参数Bitmap，为什么呢？
这是因为传进去的Bitmap与通过这个Bitmap创建的Canvas画布是紧紧联系在一起的，这个Bitmap用来存储所有绘制在Canvas上的像素信息，当使用Bitmap创建Canvas之后，后面调用所有的Canvas.drawXXX方法都发生在这个Bitmap上。

ViewGroup通常不需要绘制，因为它本身没有需要绘制的东西，如果不指定ViewGroup的背景颜色，那么ViewGroup的onDraw方法都不会被调用。但是，ViewGroup会调用dispatchDraw方法来绘制其子view，其过程同样是通过遍历所有子view并调用子view的绘制方法来完成绘制工作的。

4.自定义View(ViewGroup)
三种自定义View的方式：
(1)对现有控件进行扩展
对现有控件进行扩展的代码结构通常如下：

@Override
protected void onDraw(Canvas canvas) {
    //在回调父类方法之前实现自己的逻辑，对TextView来说就是在绘制文本之前
    super.onDraw(canvas);
    //在回调父类方法之后实现自己的逻辑，对TextView来说就是在绘制文本之后
}

例如，书中对TextView进行扩展代码节选

private void initView() {
    mPaint1 = new Paint();
    mPaint1.setColor(getResources().getColor(android.R.color.holo_blue_light));
    mPaint1.setStyle(Paint.Style.FILL);
    mPaint2 = new Paint();
    mPaint2.setColor(Color.YELLOW);
    mPaint2.setStyle(Paint.Style.FILL);
}

@Override
protected void onDraw(Canvas canvas) {
    // 绘制外层矩形
    canvas.drawRect(
            0,
            0,
            getMeasuredWidth(),
            getMeasuredHeight(),
            mPaint1);
    // 绘制内层矩形
    canvas.drawRect(
            10,
            10,
            getMeasuredWidth() - 10,
            getMeasuredHeight() - 10,
            mPaint2);
    canvas.save();
    // 绘制文字前平移10像素
    canvas.translate(10, 0);
    // 父类完成的方法，即绘制文本
    super.onDraw(canvas);
    canvas.restore();
}

(2)通过组合来实现新的控件
这种方式通常需要继承一个合适的ViewGroup，再给它添加指定功能的控件，从而组合成新的复合控件。
[项目中一般使用这种方式创建应用内统一的提示信息界面，可以是提示正在加载，也可以是提示数据出错了等]
例如，书中的TopBar例子：

public class TopBar extends RelativeLayout {

    // 包含topbar上的元素：左按钮、右按钮、标题
    private Button mLeftButton, mRightButton;
    private TextView mTitleView;

    // 布局属性，用来控制组件元素在ViewGroup中的位置
    private LayoutParams mLeftParams, mTitlepParams, mRightParams;

    // 左按钮的属性值，即我们在atts.xml文件中定义的属性
    private int mLeftTextColor;
    private Drawable mLeftBackground;
    private String mLeftText;
    // 右按钮的属性值，即我们在atts.xml文件中定义的属性
    private int mRightTextColor;
    private Drawable mRightBackground;
    private String mRightText;
    // 标题的属性值，即我们在atts.xml文件中定义的属性
    private float mTitleTextSize;
    private int mTitleTextColor;
    private String mTitle;

    // 映射传入的接口对象
    private topbarClickListener mListener;
    ......
}

(3)重写View来实现全新的控件
创建自定义View的难点在于绘制控件和实现交互，通常需要继承View类，并重写onDraw、onMeasure等方法来实现绘制逻辑，同时通过重写onTouchEvent等触控事件方法来实现交互逻辑。
[这类自定义View是比较常用的，自己以前也写过几个简单的例子，参见AnnotationView和ProgressView项目，或者参考之前的博文Android Text View with Custom Font，一个可以自定义字体的TextView]
例如，书中的弧线展示图例子

@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    mMeasureWidth = MeasureSpec.getSize(widthMeasureSpec);
    mMeasureHeigth = MeasureSpec.getSize(heightMeasureSpec);
    setMeasuredDimension(mMeasureWidth, mMeasureHeigth);
    initView();
}

@Override
protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);
    // 绘制圆
    canvas.drawCircle(mCircleXY, mCircleXY, mRadius, mCirclePaint);
    // 绘制弧线
    canvas.drawArc(mArcRectF, 270, mSweepAngle, false, mArcPaint);
    // 绘制文字
    canvas.drawText(mShowText, 0, mShowText.length(), mCircleXY, mCircleXY + (mShowTextSize / 4), mTextPaint);
}

5.事件拦截机制分析 [后面有专门对Android事件拦截机制分析的部分，此处略过]

第四章 ListView使用技巧

1.使用ViewHolder模式提高效率
这种方式是必须要用的！下面的例子是一个常见的使用ViewHolder并且包含多个item type的Adapter例子：

public class ChatItemListViewAdapter extends BaseAdapter {

    private List<ChatItemListViewBean> mData;
    private LayoutInflater mInflater;

    public ChatItemListViewAdapter(Context context, List<ChatItemListViewBean> data) {
        this.mData = data;
        mInflater = LayoutInflater.from(context);
    }

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

    @Override
    public Object getItem(int position) {
        return mData.get(position);
    }

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

    @Override
    public int getItemViewType(int position) {
        ChatItemListViewBean bean = mData.get(position);
        return bean.getType();
    }

    @Override
    public int getViewTypeCount() {
        return 2;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder holder;
        if (convertView == null) {
            if (getItemViewType(position) == 0) {
                holder = new ViewHolder();
                convertView = mInflater.inflate(R.layout.chat_item_itemin, null);
                holder.icon = (ImageView) convertView.findViewById(R.id.icon_in);
                holder.text = (TextView) convertView.findViewById(R.id.text_in);
            } else {
                holder = new ViewHolder();
                convertView = mInflater.inflate(R.layout.chat_item_itemout, null);
                holder.icon = (ImageView) convertView.findViewById(R.id.icon_out);
                holder.text = (TextView) convertView.findViewById(R.id.text_out);
            }
            convertView.setTag(holder);
        } else {
            holder = (ViewHolder) convertView.getTag();
        }
        holder.icon.setImageBitmap(mData.get(position).getIcon());
        holder.text.setText(mData.get(position).getText());
        return convertView;
    }

    public final class ViewHolder {
        public ImageView icon;
        public TextView text;
    }

}

2.listview的一些属性设置
(1)设置分隔线
android:divider=""@android:color/white"
android:dividerHeight="10dp"
android:divider="@null" （设置分隔线透明）
(2)隐藏滚动条
android:scrollbars="none"
(3)取消item的点击效果
android:listSelector="@android:color/transparent"

3.listview的一些方法设置
(1)设置listview显示在第几项
listview.setSelection(n); 这个方法类似scrollTo瞬间完成移动，平滑移动可以使用下面的方式
listview.smoothScrollBy(distance, duration);
listview.smoothScrollByOffset(offset);
listview.smoothScrollToPosition(index);
(2)处理空listview
listview.setEmptyView(View)

4.动态修改listview
在使用adapter的notifyDataSetChanged方法时，必须保证传进adapter的数据list和发生数据变化的list是同一个对象，否则将无法看到效果。

5.listview滑动监听
监听listview的滑动事件的方法有两种：一个是OnTouchListener来实现监听，另一个是使用OnScrollListener来实现监听。
例如，书中实现了一个监听listview上下滑动事件操纵toolbar显示和隐藏效果的例子：

public class ScrollHideListView extends Activity {

    private Toolbar mToolbar;
    private ListView mListView;
    private String[] mStr = new String[20];
    private int mTouchSlop;
    private float mFirstY;
    private float mCurrentY;
    private int direction;
    private ObjectAnimator mAnimator;
    private boolean mShow = true;

    View.OnTouchListener myTouchListener = new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    mFirstY = event.getY();
                    break;
                case MotionEvent.ACTION_MOVE:
                    mCurrentY = event.getY();
                    if (mCurrentY - mFirstY > mTouchSlop) {
                        direction = 0;// down
                    } else if (mFirstY - mCurrentY > mTouchSlop) {
                        direction = 1;// up
                    }
                    if (direction == 1) {
                        if (mShow) {
                            toolbarAnim(1);//show
                            mShow = !mShow;
                        }
                    } else if (direction == 0) {
                        if (!mShow) {
                            toolbarAnim(0);//hide
                            mShow = !mShow;
                        }
                    }
                    break;
                case MotionEvent.ACTION_UP:
                    break;
            }
            return false;
        }
    };

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.scroll_hide);
        mTouchSlop = ViewConfiguration.get(this).getScaledTouchSlop();
        mToolbar = (Toolbar) findViewById(R.id.toolbar);
        mListView = (ListView) findViewById(R.id.listview);
        for (int i = 0; i < mStr.length; i++) {
            mStr[i] = "Item " + i;
        }
        View header = new View(this);
        header.setLayoutParams(new AbsListView.LayoutParams(
                AbsListView.LayoutParams.MATCH_PARENT,
                (int) getResources().getDimension( R.dimen.abc_action_bar_default_height_material)));
        mListView.addHeaderView(header);
        mListView.setAdapter(new ArrayAdapter<String>(
                ScrollHideListView.this,
                android.R.layout.simple_expandable_list_item_1,
                mStr));
        mListView.setOnTouchListener(myTouchListener);
    }

    private void toolbarAnim(int flag) {
        if (mAnimator != null && mAnimator.isRunning()) {
            mAnimator.cancel();
        }
        if (flag == 0) {
            mAnimator = ObjectAnimator.ofFloat(mToolbar, "translationY", mToolbar.getTranslationY(), 0);
        } else {
            mAnimator = ObjectAnimator.ofFloat(mToolbar, "translationY", mToolbar.getTranslationY(), -mToolbar.getHeight());
        }
        mAnimator.start();
    }
}

监听listview的OnScrollListener的一般实现

mListView.setOnScrollListener(new AbsListView.OnScrollListener() {
    @Override
    public void onScrollStateChanged(AbsListView view, int scrollState) {
        switch (scrollState){
            case SCROLL_STATE_IDLE://滑动停止时
                break;
            case SCROLL_STATE_TOUCH_SCROLL://正在滑动时
                break;
            case SCROLL_STATE_FLING://手指抛动之后listview由于惯性继续滑动
                break;
        }
    }

    @Override
    public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
        //firstVisibleItem 第一个可见的item的id
        //visibleItemCount 可见的item的总数
        //totalItemCount   所有item的总数
    }
});

获得当前可视的item的位置等信息的便捷方法

mListView.getLastVisiblePosition();//获取可视区域最后一个item的id
mListView.getFirstVisiblePosition();//获取可视区域第一个item的id

第五章 Android Scroll分析

1.获取坐标值的各种方法
图片来自Android中的坐标系以及获取坐标的方法

2.实现滑动的基本思想
当触摸view时，系统记下当前触摸点坐标；当手指移动时，系统记下移动后的触摸点坐标，从而获取到相对于前一次坐标点的偏移量，并通过偏移量来修改view的坐标，这样不断重复，从而实现滑动过程。

3.常用的滑动实现方法
(1)修改view的left、top、right和bottom的值：调用layout方法或者offsetLeftAndRight等方法
绝对坐标系下

// 绝对坐标方式
@Override
public boolean onTouchEvent(MotionEvent event) {
    int rawX = (int) (event.getRawX());
    int rawY = (int) (event.getRawY());
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            // 记录触摸点坐标
            lastX = rawX;
            lastY = rawY;
            break;
        case MotionEvent.ACTION_MOVE:
            // 计算偏移量
            int offsetX = rawX - lastX;
            int offsetY = rawY - lastY;
            // 在当前left、top、right、bottom的基础上加上偏移量
            layout(getLeft() + offsetX,
                    getTop() + offsetY,
                    getRight() + offsetX,
                    getBottom() + offsetY);
            // 重新设置初始坐标
            lastX = rawX;
            lastY = rawY;
            break;
    }
    return true;
}

视图坐标系下

// 视图坐标方式
@Override
public boolean onTouchEvent(MotionEvent event) {
    int x = (int) event.getX();
    int y = (int) event.getY();
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            // 记录触摸点坐标
            lastX = x;
            lastY = y;
            break;
        case MotionEvent.ACTION_MOVE:
            // 计算偏移量
            int offsetX = x - lastX;
            int offsetY = y - lastY;
            // 在当前left、top、right、bottom的基础上加上偏移量
            layout(getLeft() + offsetX,
                    getTop() + offsetY,
                    getRight() + offsetX,
                    getBottom() + offsetY);
                    //offsetLeftAndRight(offsetX);
                    //offsetTopAndBottom(offsetY);
            break;
    }
    return true;
}

(2)修改布局参数LayoutParams：修改子view的getLayoutParams或者使用ViewGroup.MarginLayoutParams
子view的getLayoutParams得到的LayoutParams需要和父ViewGroup的Layout类型一致，如果使用ViewGroup.MarginLayoutParams的话那就方便一些，不需要考虑父ViewGroup的具体类型。

@Override
public boolean onTouchEvent(MotionEvent event) {
    int x = (int) event.getX();
    int y = (int) event.getY();
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            // 记录触摸点坐标
            lastX = (int) event.getX();
            lastY = (int) event.getY();
            break;
        case MotionEvent.ACTION_MOVE:
            // 计算偏移量
            int offsetX = x - lastX;
            int offsetY = y - lastY;
            //ViewGroup.MarginLayoutParams layoutParams = (ViewGroup.MarginLayoutParams) getLayoutParams();
            LinearLayout.LayoutParams layoutParams = (LinearLayout.LayoutParams) getLayoutParams();
            layoutParams.leftMargin = getLeft() + offsetX;
            layoutParams.topMargin = getTop() + offsetY;
            setLayoutParams(layoutParams);
            break;
    }
    return true;
}

(3)使用scrollTo和scrollBy方法
scrollTo和scrollBy方法移动的是view的content，即让view的内容移动。如果在ViewGroup中使用scrollTo或者scrollBy方法，那么移动的是所有子view。但如果在view中使用，那么移动的将是view的内容，例如TextView，content就是它的文本；ImageView，content就是它的drawable对象。

@Override
public boolean onTouchEvent(MotionEvent event) {
    int x = (int) event.getX();
    int y = (int) event.getY();
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            lastX = (int) event.getX();
            lastY = (int) event.getY();
            break;
        case MotionEvent.ACTION_MOVE:
            int offsetX = x - lastX;
            int offsetY = y - lastY;
            ((View) getParent()).scrollBy(-offsetX, -offsetY);//注意这里需要使用负号进行移动！
            break;
    }
    return true;
}

(4)使用Scroller实现平滑效果
前面的滑动都不是平滑的，而Scroller是可以实现平滑效果的，它的实现原理很简单，其实就是不断调用scrollTo和scrollBy方法来实现view的平滑移动，因为人眼的视觉暂留特性看起来就是平滑的。
使用Scroller主要有三个步骤：
1.初始化Scroller对象，一般在view初始化的时候同时初始化scroller；
2.重写view的computeScroll方法，computeScroll方法是不会自动调用的，只能通过invalidate->draw->computeScroll来间接调用，实现循环获取scrollX和scrollY的目的，当移动过程结束之后，Scroller.computeScrollOffset方法会返回false，从而中断循环；
3.调用Scroller.startScroll方法，将起始位置、偏移量以及移动时间(可选)作为参数传递给startScroll方法。

例如，书中给出的例子，子view在被拖动之后会自动平滑移动到原来的位置

private void ininView(Context context) {
    setBackgroundColor(Color.BLUE);
    // 初始化Scroller
    mScroller = new Scroller(context);
}

@Override
public void computeScroll() {
    super.computeScroll();
    // 判断Scroller是否执行完毕
    if (mScroller.computeScrollOffset()) {
        ((View) getParent()).scrollTo( mScroller.getCurrX(), mScroller.getCurrY());
        // 通过重绘来不断调用computeScroll
        invalidate();//很重要
    }
}

@Override
public boolean onTouchEvent(MotionEvent event) {
    int x = (int) event.getX();
    int y = (int) event.getY();
    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            lastX = (int) event.getX();
            lastY = (int) event.getY();
            break;
        case MotionEvent.ACTION_MOVE:
            int offsetX = x - lastX;
            int offsetY = y - lastY;
            ((View) getParent()).scrollBy(-offsetX, -offsetY);
            break;
        case MotionEvent.ACTION_UP:
            // 手指离开时，执行滑动过程
            View viewGroup = ((View) getParent());
            mScroller.startScroll( viewGroup.getScrollX(), viewGroup.getScrollY(),
                    -viewGroup.getScrollX(), -viewGroup.getScrollY());
            invalidate();//很重要
            break;
    }
    return true;
}

(5)属性动画 [后面有专门对Android动画分析的部分，此处略过]

(6)使用ViewDragHelper
ViewDragHelper类使用较少，它是support库中DrawerLayout和SlidingPaneLayout内部实现的重要类！
之前读过类似侧边栏菜单的实现代码(SlidingMenu)，个人感觉ViewDragHelper其实是更高层次的封装，将这类效果所需的接口暴露出来以简化类似的开发工作，书中给了一个例子，介绍了ViewDragHelper的使用，实现了类似侧边栏菜单的效果

public class DragViewGroup extends FrameLayout {

    private ViewDragHelper mViewDragHelper;
    private View mMenuView, mMainView;
    private int mWidth;

    public DragViewGroup(Context context) {
        super(context);
        initView();
    }

    public DragViewGroup(Context context, AttributeSet attrs) {
        super(context, attrs);
        initView();
    }

    public DragViewGroup(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView();
    }

    @Override
    protected void onFinishInflate() {
        super.onFinishInflate();
        mMenuView = getChildAt(0);
        mMainView = getChildAt(1);
    }

    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        mWidth = mMenuView.getMeasuredWidth();
    }

    @Override
    public boolean onInterceptTouchEvent(MotionEvent ev) {
        return mViewDragHelper.shouldInterceptTouchEvent(ev);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        //将触摸事件传递给ViewDragHelper,此操作必不可少
        mViewDragHelper.processTouchEvent(event);
        return true;
    }

    private void initView() {
        mViewDragHelper = ViewDragHelper.create(this, callback);
    }

    private ViewDragHelper.Callback callback = new ViewDragHelper.Callback() {

                // 何时开始检测触摸事件
                @Override
                public boolean tryCaptureView(View child, int pointerId) {
                    //如果当前触摸的child是mMainView时开始检测
                    return mMainView == child;
                }

                // 触摸到View后回调
                @Override
                public void onViewCaptured(View capturedChild, int activePointerId) {
                    super.onViewCaptured(capturedChild, activePointerId);
                }

                // 当拖拽状态改变，比如idle，dragging
                @Override
                public void onViewDragStateChanged(int state) {
                    super.onViewDragStateChanged(state);
                }

                // 当位置改变的时候调用,常用与滑动时更改scale等
                @Override
                public void onViewPositionChanged(View changedView, int left, int top, int dx, int dy) {
                    super.onViewPositionChanged(changedView, left, top, dx, dy);
                }

                // 处理垂直滑动
                @Override
                public int clampViewPositionVertical(View child, int top, int dy) {
                    return 0;
                }

                // 处理水平滑动
                @Override
                public int clampViewPositionHorizontal(View child, int left, int dx) {
                    return left;
                }

                // 拖动结束后调用
                @Override
                public void onViewReleased(View releasedChild, float xvel, float yvel) {
                    super.onViewReleased(releasedChild, xvel, yvel);
                    //手指抬起后缓慢移动到指定位置
                    if (mMainView.getLeft() < 500) {
                        //关闭菜单，相当于Scroller的startScroll方法
                        mViewDragHelper.smoothSlideViewTo(mMainView, 0, 0);
                        ViewCompat.postInvalidateOnAnimation(DragViewGroup.this);
                    } else {
                        //打开菜单
                        mViewDragHelper.smoothSlideViewTo(mMainView, 300, 0);
                        ViewCompat.postInvalidateOnAnimation(DragViewGroup.this);
                    }
                }
            };

    @Override
    public void computeScroll() {
        if (mViewDragHelper.continueSettling(true)) {
            ViewCompat.postInvalidateOnAnimation(this);
        }
    }
}

posted @ 2016-06-21 20:59 linghu_java 阅读(1213) 评论(0) 编辑收藏举报

刷新页面返回顶部

linghu_java

第二章 控件架构与自定义控件详解 + ListView使用技巧 + Scroll分析

第四章 ListView使用技巧

第五章 Android Scroll分析

公告

第二章控件架构与自定义控件详解 + ListView使用技巧 + Scroll分析