Android教程網
  1. 首頁
  2. Android 技術
  3. Android 手機
  4. Android 系統教程
  5. Android 游戲
 Android教程網 >> Android技術 >> 關於Android編程 >> Android自定義view進階-- 神奇的貝塞爾曲線

Android自定義view進階-- 神奇的貝塞爾曲線

編輯:關於Android編程

今天給大家介紹一個非常神奇的曲線,貝塞爾曲線。相信大家之前都有耳聞。

很久之前就久聞該線大名,但是一直不是很了解,在經過一番谷歌之後,有了初步的概念:三點確定一條曲線:起點,終點,輔助點。

三個點的基本關系如下:

\

當初看這圖我也看了老半天,只知道是非常平滑,不知道三個點的具體關系,於是變寫了一段程序來測試輔助點與始終點的關系。

Android 的Path類提供了繪制二階貝塞爾曲線的方法,使用方法如下:

        //設置起點
        path.moveTo(200,200);
        //設置輔助點坐標 300,200       終點坐標400,200

        path.quadTo(300, 200, 400, 200);

這裡我將貝塞爾曲線的輔助點y軸和起始點設置相同,draw以後效果如下:

\

看到是一條直線,這是因為他y軸沒有拉伸,只是x軸進行了拉伸。把輔助點y+100嘗試

\

看到已經拉伸。。其實這樣還是不能很好的體現 貝塞爾曲線的規律。 所以要持續改變,研究他的規律,這裡重寫onTouchEvent,讓觸摸點的位置作為輔助點。觀察變化。

@Override
    protected void onDraw(Canvas canvas) {
        Paint p = new Paint();
        p.setStyle(Paint.Style.STROKE);
        p.setStrokeWidth(10);
        Path path = new Path();
        path.moveTo(200, 200);
        path.quadTo(mSupX, mSupY, 400, 200);
        canvas.drawPath(path,p);
        super.onDraw(canvas);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()){
            case MotionEvent.ACTION_MOVE:
                mSupX = event.getX();
                mSupY = event.getY();
                invalidate();
        }
        return true;
    }

\

可以看到 是根據鼠標位置變化的曲線,可是現在還是不能很好的表現曲線的突出點和輔助點關系,接下來把輔助點也畫出來,方便觀察。

        canvas.drawPoint(mSupX,mSupY,p);
\

這下,輔助點和曲線的關系就很明顯了。

許多炫酷的效果都離不開貝塞爾曲線,貝塞爾曲線的應用:仿360內存清理效果。

  1. 上一頁:
  2. 下一頁:
熱門文章
閱讀排行版
Copyright © Android教程網 All Rights Reserved