如何在安卓应用中添加饼图
先决条件:
A 饼状图是一个圆形的统计图形,它被分成若干个切片来说明数字比例。它描绘了一个使用“饼图切片”的特殊图表,其中每个扇区显示数据的相对大小。圆形图以半径的形式切割成描述相对频率或幅度的线段,也称为圆形图。饼图以百分比表示数字,所有分段的总和必须等于 100%。
让我们看看将饼图添加到安卓应用的步骤。
- 第一步:开启新项目
-
第二步:在进入编码部分之前,你首先要做一些前置任务。
-
转到应用->RES->values->colors . XML部分,为您的应用设置颜色。
```java <?xml version="1.0" encoding="utf-8"?> #024265 #024265 #05af9b
#fb7268 #ededf2 #E3E0E0
#FFA726 #66BB6A #EF5350 #29B6F6
```
-
转到梯度脚本- >构建.梯度(模块:应用)部分,导入以下依赖项,然后单击上面弹出的“立即同步”。
build . gradle(:app)
```java // For Card view implementation 'androidx.cardview:cardview:1.0.0'
// Chart and graph library implementation 'com.github.blackfizz:eazegraph:1.2.5l@aar' implementation 'com.nineoldandroids:library:2.4.0' ```
-
-
第三步:设计用户界面
-
下面是 xml 文件的代码。
activity _ main . XML
```java <?xml version="1.0" encoding="utf-8"?> <RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/color_white" tools:context=".MainActivity">
<org.eazegraph.lib.charts.PieChart xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/piechart" android:layout_width="0dp" android:layout_height="match_parent" android:padding="6dp" android:layout_weight="1" android:layout_marginTop="15dp" android:layout_marginLeft="15dp" android:layout_marginBottom="15dp"
/>
View android:layout_width="15dp" android:layout_height="match_parent" android:background="@color/R"/
<View android:layout_width="match_parent" android:layout_height="1dp" android:background="@color/color_two" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" />
<View android:layout_width="match_parent" android:layout_height="1dp" android:background="@color/color_two" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" />
<View android:layout_width="match_parent" android:layout_height="1dp" android:background="@color/color_two" android:layout_marginLeft="20dp" android:layout_marginRight="20dp" />
```
-
After using this code in .xml file, the UI will be like:
-
-
Step4: Working with Java file
-
打开类内的MainActivity.java文件,首先创建对象的文本视图类和饼图类。
java // Create the object of TextView and PieChart class TextView tvR, tvPython, tvCPP, tvJava; PieChart pieChart;
-
其次,在
onCreate()
方法中,我们必须将这些对象与我们已经给出的它们各自的 id 联系起来。XML 文件。java // Link those objects with their respective // id's that we have given in .XML file tvR = findViewById(R.id.tvR); tvPython = findViewById(R.id.tvPython); tvCPP = findViewById(R.id.tvCPP); tvJava = findViewById(R.id.tvJava); pieChart = findViewById(R.id.piechart);
-
在
onCreate()
方法之外创建一个private void setData()
方法并定义。 - 在
setData()
方法中,最重要的任务是如何在文本文件和饼图中设置数据。 -
首先在
setData()
方法里面设置在各自的文本视图中使用的语言的百分比。java // Set the percentage of language used tvR.setText(Integer.toString(40)); tvPython.setText(Integer.toString(30)); tvCPP.setText(Integer.toString(5)); tvJava.setText(Integer.toString(25));
-
然后将这些数据设置到饼图中,并使用
addPieSlice()
方法设置它们各自的颜色。java // Set the data and color to the pie chart pieChart.addPieSlice( new PieModel( "R", Integer.parseInt(tvR.getText().toString()), Color.parseColor("#FFA726"))); pieChart.addPieSlice( new PieModel( "Python", Integer.parseInt(tvPython.getText().toString()), Color.parseColor("#66BB6A"))); pieChart.addPieSlice( new PieModel( "C++", Integer.parseInt(tvCPP.getText().toString()), Color.parseColor("#EF5350"))); pieChart.addPieSlice( new PieModel( "Java", Integer.parseInt(tvJava.getText().toString()), Color.parseColor("#29B6F6")));
-
为了看起来更好,使用
startAnimation()
激活饼图。java // To animate the pie chart pieChart.startAnimation();
-
最后调用
onCreate()
方法里面的setData()
方法。
以下是 MainActivity.java 文件的完整代码:
MainActivity.java
```java package com.example.piechart;
// Import the required libraries import androidx.appcompat.app.AppCompatActivity; import android.graphics.Color; import android.os.Bundle; import android.widget.TextView; import org.eazegraph.lib.charts.PieChart; import org.eazegraph.lib.models.PieModel;
public class MainActivity extends AppCompatActivity {
// Create the object of TextView // and PieChart class TextView tvR, tvPython, tvCPP, tvJava; PieChart pieChart;
@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main);
// Link those objects with their // respective id's that // we have given in .XML file tvR = findViewById(R.id.tvR); tvPython = findViewById(R.id.tvPython); tvCPP = findViewById(R.id.tvCPP); tvJava = findViewById(R.id.tvJava); pieChart = findViewById(R.id.piechart);
// Creating a method setData() // to set the text in text view and pie chart setData(); }
private void setData() {
// Set the percentage of language used tvR.setText(Integer.toString(40)); tvPython.setText(Integer.toString(30)); tvCPP.setText(Integer.toString(5)); tvJava.setText(Integer.toString(25));
// Set the data and color to the pie chart pieChart.addPieSlice( new PieModel( "R", Integer.parseInt(tvR.getText().toString()), Color.parseColor("#FFA726"))); pieChart.addPieSlice( new PieModel( "Python", Integer.parseInt(tvPython.getText().toString()), Color.parseColor("#66BB6A"))); pieChart.addPieSlice( new PieModel( "C++", Integer.parseInt(tvCPP.getText().toString()), Color.parseColor("#EF5350"))); pieChart.addPieSlice( new PieModel( "Java", Integer.parseInt(tvJava.getText().toString()), Color.parseColor("#29B6F6")));
// To animate the pie chart pieChart.startAnimation(); } } ```
-
版权属于:月萌API www.moonapi.com,转载请注明出处