3月21日

74881 ワード

きょう習った

  • TODOプロジェクトを使用してTODOアプリケーションを作成(10)
  • を完了

    Chartの作成


    Chart


    グラフを作成するにはライブラリをダウンロードする必要があります
    implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
    ++を追加してもエラーは発生しません.
    maven { url 'https://jitpack.io' }

    Chartを管理するパーティションの作成

  • ViewPager機能の使用
    viewPagerとは、画面をスクロールするときに横にスムーズに移行する動作です.
    同様の画面を連続表示するのに適しています
    ラベルには何の変化もないので、Pagerにジャンプする際には、ラベルも画面に揃える必要があり、一緒に選択する方法
  • を加える必要がある.
    package com.example.todo.fragment.todo;
    
    import android.os.Bundle;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    
    import androidx.annotation.NonNull;
    import androidx.annotation.Nullable;
    import androidx.fragment.app.Fragment;
    import androidx.fragment.app.FragmentManager;
    import androidx.fragment.app.FragmentPagerAdapter;
    import androidx.viewpager.widget.ViewPager;
    
    import com.example.todo.R;
    import com.example.todo.fragment.chart.BarChartFragment;
    import com.example.todo.fragment.chart.PieChartFragment;
    import com.github.mikephil.charting.charts.BarChart;
    import com.google.android.material.tabs.TabLayout;
    
    import java.util.ArrayList;
    import java.util.List;
    
    public class TodoChartFragment extends Fragment {
        public static final String TAG = "TodoChartFragment";
    
        private TabLayout.Tab tab1, tab2;
        private ViewPager viewPager;
        private BarChartFragment barChartFragment;
        private PieChartFragment pieChartFragment;
    
        @Nullable
        @Override
        public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
            View view = inflater.inflate(R.layout.fragment_todo_chart, container, false);
    
            // 뷰 참조 가져오기
            TabLayout tabLayout = view.findViewById(R.id.tabs);
            viewPager = view.findViewById(R.id.viewPager);
    
            // 탭 생성해서 추가
            tab1 = tabLayout.newTab().setText("원형 차트");
            tab2 = tabLayout.newTab().setText("막대 차트");
    
            // 탭 레이아웃에 탭 추가하기
            tabLayout.addTab(tab1);
            tabLayout.addTab(tab2);
    
            // 탭레이아웃에 탭선택 이벤트 연결하기
            tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
                @Override
                public void onTabSelected(TabLayout.Tab tab) {
                    int position = tab.getPosition(); // TabLayout에 추가된 순서, 0부터 시작함
    
    //               if (position == 0) {
    //                   viewPager.setCurrentItem(0);
    //                   pieChartFragment.animaetChart();
    //               } else if (position == 1) {
    //                   viewPager.setCurrentItem(1);
    //                   barChartFragment.animaetChart();
    //               }
                    viewPager.setCurrentItem(position);
                }
    
    
    			// 선택이 안됬을 때
                @Override
                public void onTabUnselected(TabLayout.Tab tab) {
    
                }
    			// 다시 선택 됬을 때
                @Override
                public void onTabReselected(TabLayout.Tab tab) {
    
                }
            });
    
            // 뷰페이저의 캐시기능, 미리 페이지를 준비를 해놔서 쾌적하게 이용가능
            viewPager.setOffscreenPageLimit(2);
    
            MyPagerAdapter pagerAdapter = new MyPagerAdapter(getActivity().getSupportFragmentManager());
    
            barChartFragment = new BarChartFragment();
            pieChartFragment = new PieChartFragment();
    
            pagerAdapter.addItem(pieChartFragment);
            pagerAdapter.addItem(barChartFragment);
    
            viewPager.setAdapter(pagerAdapter);
    
            // 뷰 페이저에 페이지변경 이벤트 연결하기
            viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
                @Override
                public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                    // 넘기는 중일 때
                }
    
                @Override
                public void onPageSelected(int position) {
                    // 넘겨서 페이지가 선택 됬을 때
                    if (position == 0) {
                        tabLayout.selectTab(tab1);
                    } else if (position == 1) {
                        tabLayout.selectTab(tab2);
                    }
                }
    
                @Override
                public void onPageScrollStateChanged(int state) {
    
                }
            });
    
    
           return view;
        }// onCreateView
    
        class MyPagerAdapter extends FragmentPagerAdapter {
            private List<Fragment> items = new ArrayList<>();
    
            public MyPagerAdapter(@NonNull FragmentManager fm) {
                super(fm);
            }
    
            @NonNull
            @Override
            public Fragment getItem(int position) {
                return items.get(position);
            }
    
            @Override
            public int getCount() {
                return items.size();
            }
    
            public  void addItem(Fragment item) {
                items.add(item);
            }// class MyPagerAdapter
        } // MyPagerAdapter
    }// class TodoChartFragment

    Pie Chartの作成

    package com.example.todo.fragment.chart;
    
    import android.graphics.Color;
    import android.os.Bundle;
    import android.util.Log;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    
    import androidx.annotation.NonNull;
    import androidx.annotation.Nullable;
    import androidx.fragment.app.Fragment;
    
    import com.example.todo.R;
    import com.example.todo.retrofit.RetrofitClient;
    import com.example.todo.retrofit.TodoService;
    import com.github.mikephil.charting.charts.PieChart;
    import com.github.mikephil.charting.data.PieData;
    import com.github.mikephil.charting.data.PieDataSet;
    import com.github.mikephil.charting.data.PieEntry;
    import com.github.mikephil.charting.utils.ColorTemplate;
    
    import java.util.ArrayList;
    import java.util.List;
    import java.util.Map;
    
    import retrofit2.Call;
    import retrofit2.Callback;
    import retrofit2.Response;
    
    public class PieChartFragment extends Fragment {
    
        public static final String TAG = "PieChartFragment";
        private PieChart pieChart;
        @Nullable
        @Override
        public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
            View view = inflater.inflate(R.layout.fragment_pie_chart, container, false);
    
            // 차트 뷰 참조 가져오기
            pieChart = view.findViewById(R.id.pieChart);
    
            // 서버로 부터 차트 데이터 가져오기 요청
            requestChartData();
    
            return view;
        }
    
        private void requestChartData() {
            TodoService todoService = RetrofitClient.getTodoService();
            Call<List<Map<String, Object>>> call = todoService.getStatusPerCount("statusPerCount");
    
            call.enqueue(new Callback<List<Map<String, Object>>>() {
                @Override
                public void onResponse(Call<List<Map<String, Object>>> call, Response<List<Map<String, Object>>> response) {
                    if (!response.isSuccessful()) {
                        Log.d(TAG, "onResponse : " + response.message());
                        return;
                    }
                    List<Map<String, Object>> mapList = response.body();
                    setChartDataAndShow(mapList);
                }
    
                @Override
                public void onFailure(Call<List<Map<String, Object>>> call, Throwable t) {
                    Log.d(TAG, "onFailure : " + t.getMessage());
                }
            });
        }//requestChartData
    
        private void setChartDataAndShow(List<Map<String, Object>> mapList) {
            // 차트 데이터 준비
            List<PieEntry> pieEntries = new ArrayList<>();
            for (Map<String, Object> map : mapList) {
                String status = (String) map.get("status");
                double count = (Double) map.get("count");
    
                pieEntries.add(new PieEntry((float) count, status));
            } // for
    
            PieDataSet pieDataSet = new PieDataSet(pieEntries, "완료여부 별 갯수");
            pieDataSet.setColors(ColorTemplate.COLORFUL_COLORS);
            pieDataSet.setValueTextColor(Color.BLACK);
            pieDataSet.setValueTextSize(16f);
    
            PieData pieData = new PieData(pieDataSet);
            pieChart.setData(pieData);
            pieChart.getDescription().setEnabled(false);
            pieChart.setCenterText("완료여부 별 갯수");
            pieChart.animateXY(0,0);
        }// setChartDataAndShow
    
        public void animaetChart() {
            pieChart.animateXY(0,0);
        }
    }// class PieChartFragment


    Bar Chartの作成

    package com.example.todo.fragment.chart;
    
    import android.graphics.Color;
    import android.os.Bundle;
    import android.util.Log;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    
    import androidx.annotation.NonNull;
    import androidx.annotation.Nullable;
    import androidx.fragment.app.Fragment;
    
    import com.example.todo.R;
    import com.example.todo.domain.User;
    import com.example.todo.retrofit.RetrofitClient;
    import com.example.todo.retrofit.TodoService;
    import com.github.mikephil.charting.charts.BarChart;
    import com.github.mikephil.charting.data.BarData;
    import com.github.mikephil.charting.data.BarDataSet;
    import com.github.mikephil.charting.data.BarEntry;
    import com.github.mikephil.charting.data.PieData;
    import com.github.mikephil.charting.data.PieDataSet;
    import com.github.mikephil.charting.data.PieEntry;
    import com.github.mikephil.charting.utils.ColorTemplate;
    
    import java.util.ArrayList;
    import java.util.List;
    import java.util.Map;
    
    import retrofit2.Call;
    import retrofit2.Callback;
    import retrofit2.Response;
    
    public class BarChartFragment extends Fragment {
        public static final String TAG = "BarChartFragment";
        private BarChart barChart;
        @Nullable
        @Override
        public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
            View view = inflater.inflate(R.layout.fragment_bar_chart, container, false);
    
            // 차트 뷰 참조 가져오기
            barChart = view.findViewById(R.id.barChart);
    
            // 서버로 부터 차트 데이터 가져오기 요청
            requestChartData();
    
            return view;
        }
        private void requestChartData() {
            TodoService todoService = RetrofitClient.getTodoService();
            Call<List<User>> call = todoService.getUsernamePerCount("getUsernamePerCount");
    
            call.enqueue(new Callback<List<User>>() {
                @Override
                public void onResponse(Call<List<User>> call, Response<List<User>> response) {
                    if (!response.isSuccessful()) {
                        Log.d(TAG, "onResponse : " + response.message());
                        return;
                    }
                    List<User> userList = response.body();
                    setChartDataAndShow(userList);
                }
    
                @Override
                public void onFailure(Call<List<User>> call, Throwable t) {
                    Log.d(TAG, "onFailure : " + t.getMessage());
                }
            });
    
        }//requestChartData
    
        private void setChartDataAndShow(List<User> userList) {
            // 차트 데이터 준비
            List<BarEntry> barEntries = new ArrayList<>();
    
            for (int i = 0; i < userList.size(); i++) {
                User user = userList.get(i);
    
                String username = user.getUserName();
                float todoCount = user.getTodoCount();
    
                barEntries.add(new BarEntry(i, todoCount, username));
            } // for
            BarDataSet barDataSet = new BarDataSet(barEntries,"사용자 아이디 별 할일 갯수");
            barDataSet.setColors(ColorTemplate.COLORFUL_COLORS);
            barDataSet.setValueTextColor(Color.BLACK);
            barDataSet.setValueTextSize(16f);
    
            BarData barData = new BarData(barDataSet);
    
            barChart.setFitBars(true);
            barChart.setData(barData);
            barChart.getDescription().setText("사용자아이디 별 할일 갯수");
            barChart.animateY(0);
    
        }// setChartDataAndShow
    
        public void animaetChart() {
            barChart.animateY(0);
        }
    }// class BarChartFragment


    コメントサイト
    https://aries574.tistory.com/118
    時間が限られているため、すべての機能を実現できませんので、ご自身でご完成ください