一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖五(自定義標(biāo)記)

----------目錄一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖一(概述)一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖二(自定義xy軸)一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖三(對(duì)齊圖表、自定義柱狀圖高亮)一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖四(高亮聯(lián)動(dòng))一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖五(自定義標(biāo)記)----------demo更新地址https://github.com/AndroidJiang/StockChart----------分時(shí)圖開(kāi)發(fā)到現(xiàn)在涛救,基本已經(jīng)完成了,這部分開(kāi)發(fā)完弹沽,就會(huì)開(kāi)始著手k線(xiàn)圖部分的開(kāi)發(fā)。于是我們做了最后的對(duì)比,看下還有什么地方需要增加修改,最后發(fā)現(xiàn)咨察,還有標(biāo)記視圖沒(méi)有,先看下什么是標(biāo)記視圖(博主不知道這個(gè)名字叫啥福青,自己起的):

這里寫(xiě)圖片描述
我們可以看到高亮線(xiàn)的左右兩邊分別標(biāo)記了y軸的左右兩邊的數(shù)據(jù)扎拣, 而且左右滑動(dòng)的時(shí)候,他們位置會(huì)隨著交界點(diǎn)的變化而變。本節(jié)將會(huì)介紹下如何去自定義左右兩個(gè)標(biāo)記二蓝,相信小伙伴們理解之后誉券,中間的白點(diǎn)也是可以自己任意添加的,不妨在本篇結(jié)束后刊愚,自己動(dòng)手試一試踊跟!好了,我們開(kāi)始本章節(jié)的內(nèi)容吧鸥诽!相信有的小伙伴們?cè)趧偸褂肕P這個(gè)庫(kù)的時(shí)候商玫,一定見(jiàn)過(guò)如下的東東:
這里寫(xiě)圖片描述
沒(méi)錯(cuò),這就是標(biāo)記視圖牡借,選中某條數(shù)據(jù)的情況下拳昌,出現(xiàn)的視圖,我們就仿照它就沒(méi)錯(cuò)钠龙【嫣伲看源碼---MarkerViewpublic abstract class MarkerView extends RelativeLayout { /** * Constructor. Sets up the MarkerView with a custom layout resource. * * @param context * @param layoutResource the layout resource to use for the MarkerView */ public MarkerView(Context context, int layoutResource) { super(context); setupLayoutResource(layoutResource); } /** * Sets the layout resource for a custom MarkerView. * * @param layoutResource */ private void setupLayoutResource(int layoutResource) { View inflated = LayoutInflater.from(getContext()).inflate(layoutResource, this); inflated.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT)); inflated.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED), MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED)); // measure(getWidth(), getHeight()); inflated.layout(0, 0, inflated.getMeasuredWidth(), inflated.getMeasuredHeight()); } /** * Draws the MarkerView on the given position on the screen with the given Canvas object. * * @param canvas * @param posx * @param posy */ public void draw(Canvas canvas, float posx, float posy) { // take offsets into consideration posx += getXOffset(posx); posy += getYOffset(posy); // translate to the correct position and draw canvas.translate(posx, posy); draw(canvas); canvas.translate(-posx, -posy); } /** * This method enables a specified custom MarkerView to update it's content everytime the MarkerView is redrawn. * * @param e The Entry the MarkerView belongs to. This can also be any subclass of Entry, like BarEntry or * CandleEntry, simply cast it at runtime. * @param highlight the highlight object contains information about the highlighted value such as it's dataset-index, the * selected range or stack-index (only stacked bar entries). */ public abstract void refreshContent(Entry e, Highlight highlight); /** * Use this to return the desired offset you wish the MarkerView to have on the x-axis. By returning -(getWidth() / * 2) you will center the MarkerView horizontally. * * @param xpos the position on the x-axis in pixels where the marker is drawn * @return */ public abstract int getXOffset(float xpos); /** * Use this to return the desired position offset you wish the MarkerView to have on the y-axis. By returning * -getHeight() you will cause the MarkerView to be above the selected value. * * @param ypos the position on the y-axis in pixels where the marker is drawn * @return */ public abstract int getYOffset(float ypos);}構(gòu)造函數(shù)中要傳入顯示的布局文件,draw會(huì)根據(jù)傳入的position定位碴里,refreshContent更新里面的文本沈矿。源碼讀起來(lái)很簡(jiǎn)單,只有幾個(gè)方法而已咬腋,我們?cè)趯?shí)例的時(shí)候只需傳入我們的布局即可羹膳,于是我們模仿了一個(gè)寫(xiě)法:public class MyMarkerView extends MarkerView { private TextView markerTv; public MyMarkerView(Context context, int layoutResource) { super(context, layoutResource); markerTv = (TextView) findViewById(R.id.marker_tv); } @Override public void refreshContent(Entry e, Highlight highlight) { } @Override public int getXOffset(float xpos) { return 0; } @Override public int getYOffset(float ypos) { return 0; }}…… private void setMarkerView(){ MyMarkerView myMarkerView = new MyMarkerView(MinutesActivity.this, R.layout.mymarkerview); lineChart.setMarkerView(myMarkerView); }最后圖表進(jìn)行設(shè)置markerview,我們看下效果圖:
這里寫(xiě)圖片描述
問(wèn)題: - 位置不對(duì)根竿,默認(rèn)只有一個(gè)陵像,要顯示兩個(gè)標(biāo)記 - 觸摸柱狀圖時(shí),上面不顯示標(biāo)記 MrrkerView自身偏離Offset完成不了這樣的需求寇壳,那么我們只能從表的重寫(xiě)入手了醒颖。在MyLineChart中重寫(xiě)drawMarkerw方法public void setHighlightValue(Entry e, Highlight h) { this.e = e; if (mData == null) mIndicesToHighlight = null; else { mIndicesToHighlight = new Highlight[]{ h}; } invalidate(); } @Override protected void drawMarkers(Canvas canvas) { if (mIndicesToHighlight != null && myMarkerViewLeft != null && myMarkerViewRight != null) { for (int i = 0; i < mIndicesToHighlight.length; i++) { Entry e = this.e; if (e == null || e.getXIndex() != mIndicesToHighlight[i].getXIndex()) continue; e=mData.getEntryForHighlight(mIndicesToHighlight[i]); float[] pos = getMarkerPosition(e, mIndicesToHighlight[i]); Log.e("!!!!",pos[0]+","+pos[1]); myMarkerViewLeft.draw(canvas, mViewPortHandler.contentLeft() - myMarkerViewLeft.getWidth(), pos[1] - myMarkerViewLeft.getHeight() / 2); myMarkerViewRight.draw(canvas, mViewPortHandler.contentRight(), pos[1] - myMarkerViewRight.getHeight() / 2); float yValForXIndex1 = minuteHelper.getDatas().get(mIndicesToHighlight[i].getXIndex()).chengjiaojia; float yValForXIndex2 = minuteHelper.getDatas().get(mIndicesToHighlight[i].getXIndex()).percentage; myMarkerViewLeft.setData(yValForXIndex1); myMarkerViewRight.setData(yValForXIndex2); myMarkerViewLeft.refreshContent(e, mIndicesToHighlight[i]); myMarkerViewRight.refreshContent(e, mIndicesToHighlight[i]); /*重新計(jì)算大小*/ myMarkerViewLeft.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED), MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED)); myMarkerViewLeft.layout(0, 0, myMarkerViewLeft.getMeasuredWidth(), myMarkerViewLeft.getMeasuredHeight()); myMarkerViewRight.measure(MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED), MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED)); myMarkerViewRight.layout(0, 0, myMarkerViewRight.getMeasuredWidth(), myMarkerViewRight.getMeasuredHeight()); } } }然后在activity中private void setMarkerView(MinuteHelper mData){ MyLeftMarkerView leftMarkerView = new MyLeftMarkerView(MinutesActivity.this, R.layout.mymarkerview); MyRightMarkerView rightMarkerView = new MyRightMarkerView(MinutesActivity.this, R.layout.mymarkerview); lineChart.setMarker(leftMarkerView, rightMarkerView, mData); }同時(shí)圖表的選中也得進(jìn)行修改傳入?yún)?shù)lineChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() { @Override public void onValueSelected(Entry e, int dataSetIndex, Highlight h) { barChart.highlightValues(new Highlight[]{h}); lineChart.setHighlightValue(e,h); } @Override public void onNothingSelected() { } }); barChart.setOnChartValueSelectedListener(new OnChartValueSelectedListener() { @Override public void onValueSelected(Entry e, int dataSetIndex, Highlight h) { // barChart.highlightValues(new Highlight[]{h}); lineChart.setHighlightValue(e, new Highlight(h.getXIndex(),0));//此函數(shù)已經(jīng)返回highlightBValues的變量,并且刷新九巡,故上面方法可以注釋 // barChart.setHighlightValue(h); } @Override public void onNothingSelected() { } });看得比較亂的同學(xué)图贸,可以直接查看demo代碼,這里只是簡(jiǎn)單的放出代碼而已冕广,邏輯上估計(jì)還有點(diǎn)亂疏日。博主不得不承認(rèn),在處理自定義標(biāo)記的部分代碼寫(xiě)的有點(diǎn)渣撒汉,中間碰到很多坑沟优,最后也是碰巧實(shí)現(xiàn)了效果,博主很納悶睬辐,為啥要從activity中傳入Entry的參數(shù)才行挠阁,而在MyLineChart中直接引用系統(tǒng)的Entry和mData卻行不通宾肺,希望哪位大神研究后能給出答案,或者在處理自定義標(biāo)記這邊有更好見(jiàn)解的歡迎留言或者聯(lián)系我侵俗。下面我們看下效果圖吧(考慮到是仿照自選股app锨用,所以顏色上也基本參考了它):
這里寫(xiě)圖片描述
----------總結(jié):分時(shí)圖寫(xiě)到這里基本告一段落了,大概的功能也都能實(shí)現(xiàn)了隘谣,如果有什么問(wèn)題增拥,請(qǐng)留言,博主一定盡力解決寻歧,同時(shí)發(fā)現(xiàn)demo有bug啥的或者更好的處理方式掌栅,也歡迎聯(lián)系我。端午后將會(huì)更新大家期待已久的K線(xiàn)圖码泛,歡迎大家star我的項(xiàng)目https://github.com/AndroidJiang/StockChart猾封,最后祝大家端午快樂(lè)!噪珊。----------目錄一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖一(概述)一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖二(自定義xy軸)一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖三(對(duì)齊圖表晌缘、自定義柱狀圖高亮)一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖四(高亮聯(lián)動(dòng))一步一步教你寫(xiě)股票走勢(shì)圖——分時(shí)圖五(自定義標(biāo)記)----------demo更新地址https://github.com/AndroidJiang/StockChart----------

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市卿城,隨后出現(xiàn)的幾起案子枚钓,更是在濱河造成了極大的恐慌铅搓,老刑警劉巖瑟押,帶你破解...
    沈念sama閱讀 206,482評(píng)論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異星掰,居然都是意外死亡多望,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,377評(píng)論 2 382
  • 文/潘曉璐 我一進(jìn)店門(mén)氢烘,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)怀偷,“玉大人,你說(shuō)我怎么就攤上這事播玖∽倒ぃ” “怎么了?”我有些...
    開(kāi)封第一講書(shū)人閱讀 152,762評(píng)論 0 342
  • 文/不壞的土叔 我叫張陵蜀踏,是天一觀的道長(zhǎng)维蒙。 經(jīng)常有香客問(wèn)我,道長(zhǎng)果覆,這世上最難降的妖魔是什么颅痊? 我笑而不...
    開(kāi)封第一講書(shū)人閱讀 55,273評(píng)論 1 279
  • 正文 為了忘掉前任,我火速辦了婚禮局待,結(jié)果婚禮上斑响,老公的妹妹穿的比我還像新娘菱属。我一直安慰自己,他們只是感情好舰罚,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,289評(píng)論 5 373
  • 文/花漫 我一把揭開(kāi)白布纽门。 她就那樣靜靜地躺著,像睡著了一般营罢。 火紅的嫁衣襯著肌膚如雪膜毁。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書(shū)人閱讀 49,046評(píng)論 1 285
  • 那天愤钾,我揣著相機(jī)與錄音瘟滨,去河邊找鬼。 笑死能颁,一個(gè)胖子當(dāng)著我的面吹牛杂瘸,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播伙菊,決...
    沈念sama閱讀 38,351評(píng)論 3 400
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼败玉,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了镜硕?” 一聲冷哼從身側(cè)響起运翼,我...
    開(kāi)封第一講書(shū)人閱讀 36,988評(píng)論 0 259
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎兴枯,沒(méi)想到半個(gè)月后血淌,有當(dāng)?shù)厝嗽跇?shù)林里發(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,476評(píng)論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡财剖,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,948評(píng)論 2 324
  • 正文 我和宋清朗相戀三年悠夯,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片躺坟。...
    茶點(diǎn)故事閱讀 38,064評(píng)論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡沦补,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出咪橙,到底是詐尸還是另有隱情夕膀,我是刑警寧澤,帶...
    沈念sama閱讀 33,712評(píng)論 4 323
  • 正文 年R本政府宣布美侦,位于F島的核電站产舞,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏音榜。R本人自食惡果不足惜庞瘸,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,261評(píng)論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望赠叼。 院中可真熱鬧擦囊,春花似錦违霞、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書(shū)人閱讀 30,264評(píng)論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至贯被,卻和暖如春眼五,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背彤灶。 一陣腳步聲響...
    開(kāi)封第一講書(shū)人閱讀 31,486評(píng)論 1 262
  • 我被黑心中介騙來(lái)泰國(guó)打工看幼, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人幌陕。 一個(gè)月前我還...
    沈念sama閱讀 45,511評(píng)論 2 354
  • 正文 我出身青樓诵姜,卻偏偏與公主長(zhǎng)得像,于是被迫代替她去往敵國(guó)和親搏熄。 傳聞我的和親對(duì)象是個(gè)殘疾皇子棚唆,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,802評(píng)論 2 345

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