【flutter】pie_chartで円グラフを、fl_chartで棒グラフを作成したいがimportするとPiechartウィジェットでエラーが出る

Question

前提

import 'package:pie_chart/pie_chart.dart';
をインポートし円グラフを記載している状態で
棒グラフも記載したいと思い
import 'package:fl_chart/fl_chart.dart';
をインポートするとPiechartでエラーが出る

共存できないのでしょうか？

実現したいこと

棒グラフと円グラフを作成したい

発生している問題・エラーメッセージ

'PieChart' isn't a function.

The name 'PieChart' is defined in the libraries 'package:fl_chart/src/chart/pie_chart/pie_chart.dart (via package:fl_chart/fl_chart.dart)' and 'package:pie_chart/src/pie_chart.dart (via package:pie_chart/pie_chart.dart)'.

該当のソースコード

import 'package:flutter/material.dart';
import 'package:pie_chart/pie_chart.dart';
import 'package:fl_chart/fl_chart.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(

        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);
  
  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  double win=9;
  double lose =6;

  Map<String,double> datamap={};

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          PieChart(
            centerText: '勝率',
            dataMap: datamap={
              '勝ち': win / (win+lose)*100,
              '負け': lose / (win+lose)*100,
            },
          )
        ],
      ),
    );
  }
}

試したこと

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Answer 1

以下のようにSpecifying a library prefixを使えばとりあえず解決できます。

import 'package:fl_chart/fl_chart.dart' as lib2;

PieChartがfl_chartとpie_chartの両方に定義されているからどちらを使うか迷ったというのが正解でしょうか。
なおfl_chartパッケージ内のクラスを使う場合には、lib2.～とasに記述された名前を接頭語として付ける必要はあります。

また開発環境として何を使っているか不明ですが、VSCodeでは以下の様にエラーの詳細を見ることができます。

この青いアンダースコア部分をクリックすると、エラーの詳細とその解決方法を見ることができます。
そちらを参照すれば、対応もすぐできると思います。

今回はimportを追加した結果2種類のエラーが出てしまっているので、どちらが主要因なのか判別する力は別途必要になりますが。

Comments

[ouma]

ありがとうございます
なるほど。。。そういう風に解決するのですね

androidstudioを使用していますがエラー内容への対処があまりよくわからないというのが実情です…
勉強させていただきました