MPAndroidChart實現(xiàn)K線面板(二)

上個章節(jié)我們使用MPAndroidChart完成了一個靜態(tài)的K線面板洽腺,這個章節(jié)我們將介紹如何在K線面板中處理用戶的手勢操作。

處理用戶的手勢操作

在K線面板中,需要處理的手勢操作主要包括:
1.單次點擊(加載失敗時重新加載)
2.勻速滑動(K線圖左右滾動)
3.快速滑動(前后切換股票)
4.長按后滑動(高亮顯示被選中的數(shù)據(jù))

如果你對上述手勢操作不是太了解,可以下載apk體驗一下 apk下載地址

1.設計思路

寫代碼之前我們首先來談一下設計思路,上述的手勢操作并不復雜拷况,但是結(jié)合到一起容易引起重疊,造成不好的用戶體驗掘殴。所以這次我們的設計思路是:

首先判斷長按事件赚瘦,在長按狀態(tài)下被選中數(shù)據(jù)高亮顯示;
在非長按狀態(tài)下杯巨,通過判斷滑動速率和滑動時間區(qū)分快速滑動和勻速滑動蚤告;
在勻速滑動狀態(tài)下,每滑動一個單位都重新獲取手指的位置服爷。

2.繼承CandleStickChart類

開始編寫代碼杜恰,我們首先繼承CandleStickChart類,CandleStickChart是MPAndroidChart提供的用于展示K線圖的控件仍源,在上個章節(jié)實現(xiàn)靜態(tài)K線圖的時候我們有用到:

public class TsCandleStickChart extends CandleStickChart {
    public TsCandleStickChart(Context context) {
        super(context);
    }

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

    public TsCandleStickChart(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }
}

創(chuàng)建OnTsGestureListener接口:

public interface OnTsGestureListener {
    /**
     * 單次點擊
     */
    void onChartSingleTapped();
    /**
     * 多次點擊
     */
    void onChartDoubleTapped();
    /**
     * 快速滑動
     * @param direction 滑動方向
     */
    void onChartFastSlide(int direction);
    /**
     * 勻速滑動
     * @param direction 滑動方向
     */
    void onChartSlowSlide(int direction);
    /**
     * 長按后滑動
     * @param position 當前位置
     */
    void onChartSlideLongClick(int position);
}

3.長按后滑動

按照最初的構思心褐,我們先區(qū)分將長按事件跟非長按事件,這里我們復寫setOnChartGestureListener笼踩,在onChartLongPressed中處理長按事件逗爹,其中變量isLongPressed用來記錄當前是否處于長按狀態(tài):

@Override
public void onChartLongPressed(MotionEvent me) {
    //為了避免滑動事件與高亮時間沖突,高亮事件只在長按后顯示嚎于,優(yōu)先消費滑動事件
    if (me.getFlags() == 0) {
        isLongPressed = true;
        setHighlightPerDragEnabled(true);
        highlightValue(getHighlightByTouchPoint(me.getX(), me.getY()).getXIndex(),0);
    }
}

接著我們復寫setOnChartValueSelectedListener來獲取當前被選中的數(shù)據(jù)掘而,當前處于長按狀態(tài)時,將被選中的數(shù)據(jù)高亮顯示:

setOnChartValueSelectedListener(new OnChartValueSelectedListener() {
    @Override
    public void onValueSelected(Entry e, int dataSetIndex, Highlight h) {
        if (isLongPressed && onTsGestureListener != null) {
            onTsGestureListener.onChartSlideLongClick(e.getXIndex());
        }
    }
});

4.快速滑動

在非長按狀態(tài)下于购,我們用滑動時間和滑動速率來區(qū)分快速滑動和勻速滑動:

@Override
public void onChartFling(MotionEvent me1, MotionEvent me2, float velocityX, float velocityY) {
    if (!isLongPressed && onTsGestureListener != null) {
        if((me2.getEventTime() - me2.getDownTime()) < FLIP_PERIOD){
            if (velocityX > FLIP_DISTANCE) {
                onTsGestureListener.onChartFastSlide(-1);
            } else if (velocityX < -FLIP_DISTANCE) {
                onTsGestureListener.onChartFastSlide(1);
            }
        }
    }
}

5.勻速滑動

這里使用setOnTouchListener實現(xiàn)勻速滑動袍睡,對于onTouchListener想必大家都比較熟悉,手指按下時記錄點擊的位置:

case MotionEvent.ACTION_DOWN:
    currentDownindex = motionEvent.getRawX();
    break;

每當用戶滑動的距離達到默認值時肋僧,我們會通知接口用戶滑動了一個單位斑胜。
實際操作中用戶滑動的距離可能會超過默認值控淡,超過的情況也統(tǒng)一按照滑動了一個單位進行處理,這樣可以使得滑動過程更加平順:

case MotionEvent.ACTION_MOVE:
    if(!isLongPressed && onTsGestureListener != null){
      if((motionEvent.getEventTime() - motionEvent.getDownTime()) > SLIDE_PERIOD){
      float rawX = motionEvent.getRawX();
      int distance = (int)(rawX - currentDownindex);
      if(Math.abs(distance) > INSERTDATAPIXELS){
          currentDownindex = rawX;
          int num = distance/INSERTDATAPIXELS;
          int change = num > 0?1:-1;
          onTsGestureListener.onChartSlowSlide(change);
      }
    }
}
break;

編寫完TsCandleStickChart類后止潘,我們在布局中使用TsCandleStickChart代替之前的CandleStickChart:

<com.system.ts.android.utils.view.TsCandleStickChart
    android:id="@+id/ts_candler_chart"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_below="@+id/top_line"
    android:layout_above="@+id/rl_bottom_view" />

最后掺炭,在Activity中調(diào)用setOnTsGestureListener方法實現(xiàn)上述的手勢操作:

@Bind(R.id.ts_candler_chart)
TsCandleStickChart mChart;
mChart.setOnTsGestureListener(new OnTsGestureListener() {
    @Override
     public void onChartDoubleTapped() { //多次點擊
         if (loadError) {
             String tkCode = SharedPreferencesUtils.getCurrentTkCode();
             loadStickData(tkCode, true);
         }
     }

     @Override
     public void onChartFastSlide(int direction) { //快速滑動
          String code = TkCodeUtils.getNextCode(SharedPreferencesUtils.getCurrentTkCode(), direction);
          if (!TextUtils.isEmpty(code)) {
              loadStickData(code, true);
          }
      }

      @Override
      public void onChartSlowSlide(int direction) { //勻速滑動
          onTranslateUI(direction);
      }

      @Override
      public void onChartSlideLongClick(int position) { //長按后滑動
          updateTopView(position);
      }
  });

到此為止,我們已經(jīng)實現(xiàn)了K線面板中的各種手勢操作凭戴,下個章節(jié) MPAndroidChart實現(xiàn)K線面板(三)

最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末涧狮,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子么夫,更是在濱河造成了極大的恐慌勋篓,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,194評論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件魏割,死亡現(xiàn)場離奇詭異,居然都是意外死亡钢颂,警方通過查閱死者的電腦和手機钞它,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,058評論 2 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來殊鞭,“玉大人遭垛,你說我怎么就攤上這事〔俨樱” “怎么了锯仪?”我有些...
    開封第一講書人閱讀 156,780評論 0 346
  • 文/不壞的土叔 我叫張陵,是天一觀的道長趾盐。 經(jīng)常有香客問我庶喜,道長,這世上最難降的妖魔是什么救鲤? 我笑而不...
    開封第一講書人閱讀 56,388評論 1 283
  • 正文 為了忘掉前任久窟,我火速辦了婚禮,結(jié)果婚禮上本缠,老公的妹妹穿的比我還像新娘斥扛。我一直安慰自己,他們只是感情好丹锹,可當我...
    茶點故事閱讀 65,430評論 5 384
  • 文/花漫 我一把揭開白布稀颁。 她就那樣靜靜地躺著,像睡著了一般楣黍。 火紅的嫁衣襯著肌膚如雪匾灶。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 49,764評論 1 290
  • 那天锡凝,我揣著相機與錄音粘昨,去河邊找鬼垢啼。 笑死,一個胖子當著我的面吹牛张肾,可吹牛的內(nèi)容都是我干的芭析。 我是一名探鬼主播,決...
    沈念sama閱讀 38,907評論 3 406
  • 文/蒼蘭香墨 我猛地睜開眼吞瞪,長吁一口氣:“原來是場噩夢啊……” “哼馁启!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起芍秆,我...
    開封第一講書人閱讀 37,679評論 0 266
  • 序言:老撾萬榮一對情侶失蹤惯疙,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后妖啥,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體霉颠,經(jīng)...
    沈念sama閱讀 44,122評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,459評論 2 325
  • 正文 我和宋清朗相戀三年荆虱,在試婚紗的時候發(fā)現(xiàn)自己被綠了蒿偎。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,605評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡怀读,死狀恐怖诉位,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情菜枷,我是刑警寧澤苍糠,帶...
    沈念sama閱讀 34,270評論 4 329
  • 正文 年R本政府宣布,位于F島的核電站啤誊,受9級特大地震影響岳瞭,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜坷衍,卻給世界環(huán)境...
    茶點故事閱讀 39,867評論 3 312
  • 文/蒙蒙 一寝优、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧枫耳,春花似錦乏矾、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,734評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至铅协,卻和暖如春捷沸,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背狐史。 一陣腳步聲響...
    開封第一講書人閱讀 31,961評論 1 265
  • 我被黑心中介騙來泰國打工痒给, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留说墨,地道東北人。 一個月前我還...
    沈念sama閱讀 46,297評論 2 360
  • 正文 我出身青樓苍柏,卻偏偏與公主長得像尼斧,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子试吁,可洞房花燭夜當晚...
    茶點故事閱讀 43,472評論 2 348

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 171,749評論 25 707
  • 用到的組件 1棺棵、通過CocoaPods安裝 2、第三方類庫安裝 3熄捍、第三方服務 友盟社會化分享組件 友盟用戶反饋 ...
    SunnyLeong閱讀 14,604評論 1 180
  • 發(fā)現(xiàn) 關注 消息 iOS 第三方庫烛恤、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,059評論 4 62
  • 知道了很多東西很多規(guī)律以后余耽,我的內(nèi)心缚柏,我的生活突然變得可“操縱”了(這里的操縱不是真正的操縱,而是欲望預期與現(xiàn)實達...
    cb788cf4f7c2閱讀 134評論 0 0
  • 這本書主要是文字界網(wǎng)紅咪蒙的作品集碟贾。她因為言辭犀利船惨,因為幾篇文章一炮而紅,寫的文章大都關于職場關于情感缕陕,親子等等,...
    親愛的海林先生閱讀 189評論 0 0