dokind / cryptocurrency_app

💻 Tech Stack

🌐 My socials

🔥 GitHub Stats

💰 You can help me by Donating

cryptocurrency_app's Issues

Coin Chart isn't changing when clicking on a different duration.

Great app so far, I just found an issue while trying it.

On the Coin detail screen, when you click to change duration (Today, 1W, 1M, etc.), nothing happens.
The state isn't changing and doesn't refresh the CoinRandomedChartWidget.

My guess is to change the CoinDetailScreen to a StatefulWidget and manage the state between the CoinRandomedChartWidget and the ToggleButtons.

I wasn't able to do it in a clean way but it works.
I am really interested to see how you can solve it in a cleaner way, thanks!

`

class CoinDetailScreen extends StatefulWidget {
  final DataModel coin;
  const CoinDetailScreen({
    Key? key,
    required this.coin,
  }) : super(key: key);

  @override
  State<CoinDetailScreen> createState() => _CoinDetailScreenState();
}

class _CoinDetailScreenState extends State<CoinDetailScreen> {
  List<bool> _isSelected = [true, false, false, false, false];

return Scaffold(
  backgroundColor: Color.fromRGBO(11, 12, 54, 1),
  body: CustomScrollView(
    slivers: [
      CoinDetailAppBar(coin: widget.coin, coinIconUrl: coinIconUrl),
      SliverPersistentHeader(
        pinned: true,
        delegate: SliverAppBarDelegate(
          minHeight: 360.0,
          maxHeight: 360.0,
          child: Padding(
            padding: const EdgeInsets.only(top: 32.0),
            child: Column(
              children: [
                Text(
                  '\$' + coinPrice.price.toStringAsFixed(2),
                  style: Theme.of(context).textTheme.headline4,
                ),
                Text(
                  outputDate,
                  style: TextStyle(
                    fontFamily: 'Roboto',
                    fontSize: 18,
                    color: Colors.grey,
                  ),
                ),
                CoinChartWidget(
                    coinPrice: coinPrice, color: Colors.green, data: data),
                ToggleButtons(
                  borderRadius: BorderRadius.circular(8.0),
                  borderColor: Colors.indigoAccent,
                  color: Colors.white,
                  fillColor: Colors.green,
                  selectedColor: Colors.white,
                  selectedBorderColor: Colors.indigoAccent,
                  children: [
                    ToggleButtonWidget(name: "Today"),
                    ToggleButtonWidget(name: "1W"),
                    ToggleButtonWidget(name: "1M"),
                    ToggleButtonWidget(name: "3M"),
                    ToggleButtonWidget(name: "6M"),
                  ],
                  isSelected: _isSelected,
                  onPressed: (int newIndex) {
                    setState(() {
                      for (int i = 0; i < _isSelected.length; i++) {
                        if (i == newIndex) {
                          _isSelected[i] = true;
                        } else {
                          _isSelected[i] = false;
                        }
                      }
                    });
                  },
                ),
                const SizedBox(height: 8.0)
              ],
            ),
          ),
        ),
      ),
      SliverToBoxAdapter(...)
         ],
      ),
    );
  }
}

`