zoukankan      html  css  js  c++  java
  • android 翻页效果

    这两天在研究阅读软件的翻页效果,其中iReader的效果觉得不错,效果如下:

    image

    好了,下面看下我自己弄的效果:

    image

    在里面画了一个红色的线条,是用来确定画图的范围。

    1. mPath0.moveTo(jx, jy); 
    2. mPath0.quadTo(hx, hy, kx, ky); 
    3. mPath0.lineTo(ax, ay); 
    4. mPath0.lineTo(bx, by); 
    5. mPath0.quadTo(ex, ey, cx,cy);    
    6. mPath0.lineTo(fx, fy); 
    7. mPath0.close(); 

    接着就是要求出绘制path0所需的各个顶点。

    我们已知的条件是:a点坐标(触摸点),f点坐标(显示界面的大小),直线eh是af的垂直平分线。

    剩下的就变成数学问题啦~~

    先来求出g点坐标因为g为af中点:

    显然gx=(ax+fx)/2; gy=(ay+fy)/2;

    e点坐标:

    添加补助线gm,m点坐标为(gx, mHeight);

    由相似垂直三角形egm和gmf可知:

    em=gm*gm/mf;

    这样e点坐标为:(gx-em, mHeight)

    同理可以求出h点坐标。

    C点坐标:

    为简化计算,我们令n点为ag中点,这样有三角形cjf和ehf得:

    cx=ex- ef/2 ;

    c点坐标为:(ex- ef/2, mHeight)

    同理求得j点坐标。

    以下推导需要较多的数学知识,不记得的童鞋,自觉复习去~~

    一条直线的函数为:

    Y=ax+b;

    通过已知两点求直线: a = (y2-y1)/(x2-x1);

    b = (x2*y1-y2*x1)/(x2-x1);

    两条相交直线交点的坐标为:x= (b2-b1)/(a1-a2);

    y=a1x+b1或者y=a2x+b2

    综上,4点相交的直线的交点为:

    x=( (x4*y3-y4*x3)/(x4-x3)-(x2*y1-y2*x1)/(x2-x1)) /

    ((y2-y1)/(x2-x1)- (y4-y3)/(x4-x3) )

    = ( (x4*y3-y4*x3) (x2-x1)- (x2*y1-y2*x1) (x4-x3) ) /

    ( (y2-y1) (x4-x3)- (y4-y3) (x2-x1) )

    将之前求得的 a,e,c,j四个点带入上式则可以求出 b. 同理可求k点。

    d点坐标:

    d为pe的中点,所以:

    dx=((cx+bx)/2+ex)/2

    dy=((cy+by)/2+ey)/2

    同理 可求 i 点。

    Ok,  在些需要绘制的各个点和区域都已经找到,贴图、绘制阴影就可以了,  其它的改天再写

  • 相关阅读:
    用DECODE进行排序
    linux下批量替换文件内容
    Linux下chkconfig命令详解
    linux 命令参数列表过长以及find用法
    参数上使用自定义注解在aop中无法获取到该参数
    AOP
    AOP aspect XML 配置
    AOP前世与今生,aspect
    ETL工具之——kettle使用简介
    ETL工具之kittle使用案例整理
  • 原文地址:https://www.cnblogs.com/GnagWang/p/2086672.html
Copyright © 2011-2022 走看看