10、Dp Notes底部导航栏

[size=medium] 有卡顿的现象（可能模拟器原因），滑动时没有渐变，设置一下渐变，主要是OnPageChangeListener中的onPageScrolled(int position, float offset, …)，参数position表示当前页，offset表示位置偏移（0-1）。在函数中处理一下图标的透明度，实现渐变：[/size]

if(position>=0&&position<=3){
    if(offset>0){
        alphaItem[position]=(int)(255-255*offset);
        alphaItem[position+1]=(int)(255*offset);
        if(position==0){
            alphaItem[2]=0;
            alphaItem[3]=0;
        }
        else if(position==1){
            alphaItem[0]=0;
            alphaItem[3]=0;
        }
        else if(position==2){
            alphaItem[0]=0;
            alphaItem[1]=0;
        }
        else{
            alphaItem[0]=0;
            alphaItem[1]=0;
            alphaItem[2]=0;
        }
    }
    else if(offset<0){
        alphaItem[position]=(int)(255-255*offset);
        alphaItem[position-1]=(int)(255*offset);
        if(position==0){
            alphaItem[1]=0;
            alphaItem[2]=0;
            alphaItem[3]=0;
        }
        else if(position==1){
            alphaItem[2]=0;
            alphaItem[3]=0;
        }
        else if(position==2){
            alphaItem[0]=0;
            alphaItem[3]=0;
        }
        else{
            alphaItem[0]=0;
            alphaItem[1]=0;
        }
    }
    postInvalidate();
}

[size=medium] 根据向哪个方向滑动（offset正负），和当前页（position），来计算一下每个图标的透明度，设置，刷新。还想加一个点击时的效果（水波反馈？）。类似于好多软件中的点击效果（UC菜单点击效果），简单实现原理，按下时画一个圆，半径逐渐扩大，抬起时半径逐渐减小。QEndBar中定义几个变量，boolean isDown,isUp,isMax;int downItem=-1;int colorItemDown;float radius=0;。onTouchEvent中：[/size]

case MotionEvent.ACTION_DOWN:
    isDown=true;
    radius=widthItem/4;
    isUp=false;
    touchX=(int)event.getX();	//记录点击位置
    touchY=(int)event.getY();
    if(Math.abs(touchX-positionItem[0])<widthItem/2){
        itemDown=0;
    }
    else if(Math.abs(touchX-positionItem[1])<widthItem/2){
        itemDown=1;
    }
    else if(Math.abs(touchX-widthAll/2)<widthItem/2){
        itemDown=4;												//点击中间图标
    }
    else if(Math.abs(touchX-positionItem[2])<widthItem/2){
        itemDown=2;
    }
    else if(Math.abs(touchX-positionItem[3])<widthItem/2){
        itemDown=3;
    }
    postInvalidate();
    break;
case MotionEvent.ACTION_UP:
    isDown=false;
    isUp=true;
    ……

[size=medium] 根据点击位置设置一些状态。

onDraw中：[/size]

paintOther.setColor(colorItemDown);
int alpha=colorItemDown>>24;
paintOther.setAlpha((int)(alpha*radius/widthItem*2));
if(isDown){
    if(radius<widthItem/2){
        if(itemDown==0){
            canvas.drawCircle(positionItem[0], heightAll/2, radius, paintOther);
            radius+=widthItem/4/10;
            postInvalidateDelayed(10);
        }
        else if(itemDown==1){
            ……
        }
        else if(itemDown==2){
            ……
        }
        else if(itemDown==3){
            ……
        }
        else if(itemDown==4){
            ……
        }
    }
    else{
        isMax=true;
        if(itemDown==0){
            canvas.drawCircle(positionItem[0], heightAll/2, radius, paintOther);
        }
        else if(itemDown==1){
            ……
        }
        else if(itemDown==2){
            ……
        }
        else if(itemDown==3){
            ……
        }
        else if(itemDown==4){
            ……
        }
    }
}
else if(isUp){
    if(!isMax){
        if(itemDown==0){
            canvas.drawCircle(positionItem[0], heightAll/2, radius, paintOther);
            radius+=widthItem/4/10;
            postInvalidateDelayed(10);
        }
        else if(itemDown==1){
            ……
        }
        else if(itemDown==2){
            ……
        }
        else if(itemDown==3){
            ……
        }
        else if(itemDown==4){
            ……
        }
        if(radius<widthItem/2){
            isMax=false;
        }
        else{
            isMax=true;
        }
    }
    else{
        if(radius>widthItem/4){
            if(itemDown==0){
                canvas.drawCircle(positionItem[0], heightAll/2, radius, paintOther);
                radius-=widthItem/4/5;
                postInvalidateDelayed(10);
            }
            else if(itemDown==1){
                ……
            }
            else if(itemDown==2){
                ……
            }
            else if(itemDown==3){
                ……
            }
            else if(itemDown==4){
                ……
            }
        }
        else{
            isUp=false;
            itemDown=-1;
            isMax=false;
            postInvalidateDelayed(10);
        }
    }
}

[size=medium]根据状态值画出想实现的效果，postInvalidateDelayed(25);延时刷新。比较乱，实现效果还凑合（一周弄了个底部栏，汗(-__-)）。[/size]
[img]http://dl2.iteye.com/upload/attachment/0124/2484/1a3d31ce-fe21-3c75-aa8f-52a517ca992c.gif[/img]
[color=gray][size=medium]注：这是一个.gif动图，ctrl点击图片查看。[/size][/color]

[align=right][size=medium]有志竟成——2016/10/28[/size][/align]