1. Buat proyek baru di Sketchware.
2. Di main.xml tambahkan tombol Button2 dan ListView listview2.
3. Buat CustomView items.xml dan tambahkan dua TextViews di dalamnya textview1 dan textview2.
5. Dalam MainActivity.java, tambahkan komponen Preferensi Bersama sp: sp, dan komponen Intent i.
7. Dalam acara onCreate, gunakan blok untuk mengatur jsondata ke data Json Anda yang berisi 'teks' dan 'angka' sebagai kunci. Konversikan ke Daftar Peta Daftar peta dan tampilkan di ListView.
Gunakan data Json Stringnya seperti di bawah ini dan rubah namanya sesuai keinginan anda:
[
{
"text" : "Afghan Afghani",
"number" : "0.9532"
},
{
"text" : "Armenian Dram",
"number" : "0.1487"
},
{
"text" : "Bangladeshi Taka",
"number" : "0.8572"
},
{
"text" : "Cambodian Riel",
"number" : "0.1758"
},
{
"text" : "Indonesian Rupiah",
"number" : "0.005"
},
{
"text" : "Maldivian Rufiyaa",
"number" : "4.674"
},
{
"text" : "Pakistani Rupee",
"number" : "0.5832"
},
{
"text" : "Philippine Peso",
"number" : "1.332"
},
{
"text" : "Thai Baht",
"number" : "2.226"
}
]
8. Dalam kolom listview2 onBindCustomView, tampilkan data dari daftar peta di TextViews di CustomView items.xml. ikuti seperti pada gambar
10. Dalam tombol button2 onClick di MainActivity.java, simpan daftar peta ke Preferensi Bersama dan gunakan Intent untuk pindah ke PiechartActivity.java.
11. Di piechart.xml tambahkan LinearV dan beri nama linear1.
12. Di PiechartActivity.java tambahkan komponen Shared Preferences dan beri kode sp:sp, buat variabel baru di Map dengan nama map, dan di ListMap dengan nama listmap.
13. Pada tombol onCreate event gunakan blocks untuk mengambil data pada Shared Preferences ke listmap, and gunakan kode di bawah untuk ListMap di PieChartView.xml. lihat gambar di bawah ini.
Kode untik tampilan PieChart
PieChartView chart = new PieChartView(this, listmap, "number", "text");
linear1.addView(chart);
Di sini 'teks' dan 'angka' adalah kunci yang digunakan dalam Json String di MainActivity.java.
14. Buat block pada More Block dan berikan nama extra.
15. Di blok tambahan lainnya, gunakan sumber tambah langsung blok dan masukkan kode untuk mendefinisikan kelas tampilan PieChartView.
}
public class PieChartView extends View {
private Paint fillPaint;
private Paint strokePaint;
private ArrayList<HashMap<String, Object>> list = new ArrayList<>();
private String numkey;
private String labelkey;
public PieChartView(Context context, ArrayList<HashMap<String, Object>> list, String numkey, String labelkey){
super(context);
fillPaint = new Paint();
strokePaint = new Paint();
this.list = list;
this.numkey = numkey;
this.labelkey = labelkey;
}
@Override
protected void onDraw(Canvas canvas) {
int viewWidth = this.getMeasuredWidth();
int viewHeight = this.getMeasuredHeight();
float startAngle = 0;
float sweepAngle = 0;
int lineHeight = 0;
float total = 0;
for (int i =0; i<list.size(); i++){
total = total + Float.valueOf(list.get(i).get(numkey).toString());
}
fillPaint.setStyle(android.graphics.Paint.Style.FILL);
strokePaint.setStyle(android.graphics.Paint.Style.STROKE);
strokePaint.setStrokeWidth(2);
strokePaint.setColor(Color.BLACK);
for (int i =0; i<list.size(); i++){
int col = 100+(155*i/list.size());
fillPaint.setColor(Color.rgb(40, col, col));
startAngle = startAngle+sweepAngle;
sweepAngle = 360*Float.valueOf(list.get(i).get(numkey).toString())/total;
canvas.drawArc(80, 40, viewWidth-80, viewWidth-120, startAngle, sweepAngle, true, fillPaint);
canvas.drawArc(80, 40, viewWidth-80, viewWidth-120, startAngle, sweepAngle, true, strokePaint);
lineHeight = lineHeight + 80;
canvas.drawRect(40, viewWidth - 120 + lineHeight - 40, 80, viewWidth - 120+ lineHeight, fillPaint);
fillPaint.setColor(Color.BLACK); fillPaint.setTextSize(40); canvas.drawText(list.get(i).get(labelkey).toString() + " : " + list.get(i).get(numkey).toString(), 100, viewWidth - 120+ lineHeight, fillPaint);
}
}
Kode ini hanya berfungsi untuk nilai positif.
Untuk menggunakan warna acak untuk PieChart, dalam kode di atas silahkan ubah kode pada berikut ini
int col = 100+(155*i/list.size());
fillPaint.setColor(Color.rgb(40, col, col));
to
int r = getRandom(0, 255);
int g = getRandom(0, 255);
int b = getRandom(0, 255);
fillPaint.setColor(Color.rgb(r, g, b));
16. Simpan dan Jalankan Proyek Aplikasi untuk mencoba.
SHARE















