雙摺線圖的資料分頁顯示
阿新 • • 發佈：2019-01-24
這篇部落格主要是記錄我這兩天被這個分頁的邏輯困擾的問題，今天終於解決了，先記錄下來，怕以後在遇到這樣的問題。
但是這個邏輯很固定，圖表資料是固定的5個點，想要修改的話，需要測試一下，但原理還是一樣的。
先看效果：
佈局：
<LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="horizontal"> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/xiaye_button" android:text="下一頁" /> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/shangye_button" android:text="上一頁" /> </LinearLayout> <com.github.mikephil.charting.charts.LineChart android:id="@+id/chart"android:layout_margin="5dp" android:layout_width="match_parent" android:layout_height="match_parent" />
程式碼：
從伺服器獲取資料的可以不用管，我這裡是獲取到的資料放在新的list中，然後再從各個list去得到。
package com.officialcar.offcialvehicles.ui.statistics; import android.content.Intent; import android.graphics.Color; import android.os.Bundle;import android.support.v7.app.AppCompatActivity; import android.util.Log; import android.view.View; import android.widget.Button; import android.widget.ImageView; import android.widget.TextView; import android.widget.Toast; import com.github.mikephil.charting.charts.LineChart; import com.github.mikephil.charting.components.Legend; import com.github.mikephil.charting.components.XAxis; import com.github.mikephil.charting.components.YAxis; import com.github.mikephil.charting.data.Entry; import com.github.mikephil.charting.data.LineData; import com.github.mikephil.charting.data.LineDataSet; import com.github.mikephil.charting.formatter.ValueFormatter; import com.github.mikephil.charting.interfaces.datasets.ILineDataSet; import com.github.mikephil.charting.utils.ViewPortHandler; import com.google.gson.Gson; import com.officialcar.offcialvehicles.AppConfig; import com.officialcar.offcialvehicles.R; import com.officialcar.offcialvehicles.domian.User; import com.officialcar.offcialvehicles.domian.Youhao.ListBean; import com.officialcar.offcialvehicles.domian.Youhao.YouhaoBean; import org.kymjs.kjframe.KJHttp; import org.kymjs.kjframe.http.HttpCallBack; import org.kymjs.kjframe.http.HttpConfig; import org.kymjs.kjframe.http.HttpParams; import java.text.DecimalFormat; import java.util.ArrayList; import java.util.List; import java.util.Map; public class YouhaoActivity extends AppCompatActivity implements View.OnClickListener { HttpParams params; String qian_time; String date; String str; private User user; private LineChart mChart; //5.16 暫定為5條資料 private int page_data = 5; private int my_min = 0; private int youhao = 0; private int km_num = 0; private String shang = "shang"; private String xia = "xia"; private int my_len; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_youhao_layout); mChart = (LineChart) findViewById(R.id.chart); ImageView title_img = (ImageView) findViewById(R.id.titlbar_img); title_img.setOnClickListener(this); TextView title_text = (TextView) findViewById(R.id.titlebar_text_title); title_text.setText("油耗統計"); Button shangye_button = (Button) findViewById(R.id.shangye_button); shangye_button.setOnClickListener(this); Button xiaye_button = (Button) findViewById(R.id.xiaye_button); xiaye_button.setOnClickListener(this); user = User.getInstance1(); user.setListNull(); params = new HttpParams(); Intent intent = getIntent(); qian_time = intent.getStringExtra("QIAN_TIME"); date = intent.getStringExtra("DANG_TIME"); getData(); } /** * 獲取到資料 */ public void getData() { HttpConfig httpConfig = new HttpConfig(); httpConfig.cacheTime = 0;//設定快取時間 KJHttp http = new KJHttp(httpConfig); params.put("startoilWearCar_time", qian_time); params.put("endoilWearCar_time", date); params.put("carId", ""); params.put("car_num_arr", 0); params.put("className", "com.ycya.service.ReportService"); params.put("methodName", "queryOilWear1"); http.post(AppConfig.MY_URL, params, new HttpCallBack() { @Override public void onSuccess(Map<String, String> headers, byte[] t) { super.onSuccess(t); Log.e("tag", "onSuccess"); try { str = new String(t, "gbk"); Log.e("tag", "str:" + str); setUserList(str); } catch (Exception e) { Log.e("tag", "e:" + e); e.printStackTrace(); } } @Override public void onFailure(int errorNo, String strMsg) { super.onFailure(errorNo, strMsg); Log.e("tag", "errorNo:" + errorNo); Log.e("tag", "onFailure"); } }); } private void setUserList(String str) { Gson gson = new Gson(); YouhaoBean data = gson.fromJson(str, YouhaoBean.class); List<ListBean> datalist = data.getList(); //往User裡新增資料 for (ListBean list : datalist) { //油耗 double oil = list.getOil(); user.getList_oil().add(oil); //里程 double km = list.getKm(); user.getList_km().add(km); //車牌號 String car_num = list.getCarnum(); user.getList_car_num().add(car_num); } setChartdata(); } //取油耗最高值 給圖表 public double getOilMax(){ double kk = user.getList_oil().get(0); for(int i=1;i<user.getList_oil().size();i++){ if(kk<user.getList_oil().get(i)){ kk = user.getList_oil().get(i); } } return kk; } //取里程最高值 給圖表 public double getKMMax(){ double kk = user.getList_km().get(0); for(int i=1;i<user.getList_km().size();i++){ if(kk<user.getList_km().get(i)){ kk = user.getList_km().get(i); } } return kk; } public void setChartdata() { //在這裡面新增圖表的資料 setChart(mChart); // 製作5個數據點。 setData(mChart, page_data, xia); Legend l = mChart.getLegend(); l.setForm(Legend.LegendForm.LINE); l.setTextSize(11f); l.setTextColor(Color.BLACK); l.setPosition(Legend.LegendPosition.BELOW_CHART_CENTER); XAxis xAxis = mChart.getXAxis(); // 將X座標軸的標尺刻度移動底部。 xAxis.setPosition(XAxis.XAxisPosition.BOTTOM); // X軸之間數值的間隔 xAxis.setSpaceBetweenLabels(1); xAxis.setTextSize(9f); xAxis.setTextColor(Color.BLACK); YAxis leftAxis = mChart.getAxisLeft(); setYAxisLeft(leftAxis); YAxis rightAxis = mChart.getAxisRight(); setYAxisRight(rightAxis); } private void setChart(LineChart mChart) { mChart.setDescription(""); //setNoDataTextDescription mChart.setNoDataTextDescription("非常抱歉，這個時間段沒有資料"); mChart.setNoDataText(""); mChart.setTouchEnabled(true); mChart.setDragDecelerationFrictionCoef(0.9f); mChart.setDragEnabled(true); mChart.setScaleEnabled(true); mChart.setDrawGridBackground(true); mChart.setHighlightPerDragEnabled(true); mChart.setPinchZoom(true); mChart.setBackgroundColor(Color.LTGRAY); mChart.animateX(3000); } private void setYAxisLeft(YAxis leftAxis) { // 在左側的Y軸上標出4個刻度值 leftAxis.setLabelCount(5, true); // Y座標軸軸線的顏色 leftAxis.setGridColor(Color.RED); // Y軸座標軸上座標刻度值的顏色 leftAxis.setTextColor(Color.RED); // Y座標軸最大值 leftAxis.setAxisMaxValue((float) (getKMMax()+100)); // Y座標軸最小值 leftAxis.setAxisMinValue(0); leftAxis.setStartAtZero(true); leftAxis.setDrawLabels(true); } private void setYAxisRight(YAxis rightAxis) { // Y座標軸上標出8個刻度值 rightAxis.setLabelCount(3, true); // Y座標軸上刻度值的顏色 rightAxis.setTextColor(Color.BLUE); // Y座標軸上軸線的顏色 rightAxis.setGridColor(Color.BLUE); // Y座標軸最大值 rightAxis.setAxisMaxValue((float)(getOilMax()+100)); // Y座標軸最小值 rightAxis.setAxisMinValue(0); rightAxis.setStartAtZero(true); rightAxis.setDrawLabels(true); } private void setData(LineChart mChart, int count, String biaoshi) { ArrayList<String> xVals = new ArrayList<>(); for (int i = my_min; i < count; i++) { xVals.add(user.getList_car_num().get(i)); } ArrayList<Entry> yHigh = new ArrayList<>(); LineDataSet high = new LineDataSet(yHigh, "里程(km)"); setHighTemperature(high, yHigh, biaoshi); ArrayList<Entry> yLow = new ArrayList<>(); LineDataSet low = new LineDataSet(yLow, "油耗(L)"); setLowTemperature(low, yLow, biaoshi); ArrayList<ILineDataSet> dataSets = new ArrayList<>(); dataSets.add(high); dataSets.add(low); LineData data = new LineData(xVals, dataSets); data.setValueTextColor(Color.DKGRAY); data.setValueTextSize(10f); mChart.setData(data); } private void setHighTemperature(LineDataSet high, ArrayList<Entry> yVals, String biaoshi) { int len = page_data; if (biaoshi.equals(shang)) { if (my_len < 5) { km_num = km_num - 5 - my_len; } else { km_num = km_num - 10; } int currIndex = my_min + 5; if (currIndex >= user.getList_km().size()) { len = user.getList_km().size() % page_data; if(len==0){ len=page_data; } } } for (int i = 0; i < len; i++) { double km = user.getList_km().get(km_num); km_num++; if (km_num >= user.getList_km().size()) { len = user.getList_km().size() % page_data; if(len==0){ len=page_data; } } my_len = len; yVals.add(new Entry((float) km, i)); } // 以左邊的Y座標軸為準 high.setAxisDependency(YAxis.AxisDependency.LEFT); high.setLineWidth(5f); high.setColor(Color.RED); high.setCircleSize(8f); high.setCircleColor(Color.YELLOW); high.setCircleColorHole(Color.DKGRAY); high.setDrawCircleHole(true); // 設定折線上顯示資料的格式。如果不設定，將預設顯示float資料格式。 high.setValueFormatter(new ValueFormatter() { @Override public String getFormattedValue(float v, Entry entry, int i, ViewPortHandler viewPortHandler) { DecimalFormat decimalFormat = new DecimalFormat(".0"); String s = "里程" + decimalFormat.format(v); return s; } }); } private void setLowTemperature(LineDataSet low, ArrayList<Entry> yVals, String biaoshi) { int len = page_data; if (biaoshi.equals(shang)) { if (my_len < 5) { youhao = youhao - 5 - my_len; } else { youhao = youhao - 10; } int currIndex = my_min + 5; if (currIndex > user.getList_km().size()) { len = user.getList_oil().size() % page_data; if(len==0){ len=page_data; } } } for (int i = 0; i < len; i++) { if (youhao < 0) { youhao = 0; } double oil = user.getList_oil().get(youhao); youhao++; if (youhao >= user.getList_km().size()) { len = user.getList_km().size() % page_data; if(len==0){ len=page_data; } } my_len = len; yVals.add(new Entry((float) oil, i)); } // 以右邊Y座標軸為準 low.setAxisDependency(YAxis.AxisDependency.RIGHT); // 折現的顏色 low.setColor(Color.GREEN); // 線寬度 low.setLineWidth(3f); // 折現上點的圓球顏色 low.setCircleColor(Color.BLUE); // 填充圓球中心部位洞的顏色 low.setCircleColorHole(Color.LTGRAY); // 圓球的尺寸 low.setCircleSize(5f); low.setDrawCircleHole(true); low.setValueFormatter(new ValueFormatter() { @Override public String getFormattedValue(float v, Entry entry, int i, ViewPortHandler viewPortHandler) { DecimalFormat decimalFormat = new DecimalFormat(".0"); String s = "油耗" + decimalFormat.format(v); return s; } }); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.titlbar_img: finish(); break; case R.id.shangye_button: if (my_min == 0) { Toast.makeText(getApplication(), "已經是第一頁", Toast.LENGTH_SHORT).show(); break; } int my_min3 = my_min; my_min = my_min - 5; setData(mChart, my_min3, shang); mChart.invalidate(); break; case R.id.xiaye_button: my_min = my_min + 5; if (my_min >= user.getList_car_num().size()) { Toast.makeText(getApplication(), "已經是最後一頁", Toast.LENGTH_SHORT).show(); my_min = my_min - 5; break; } int my_min2 = my_min + 5; if (my_min2 >= user.getList_car_num().size()) { my_min2 = user.getList_car_num().size(); } setData(mChart, my_min2, xia); mChart.invalidate(); break; } } }