main.dart

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Web3 News',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        colorSchemeSeed: Colors.blue,
      ),
      home: const NewsPage(),
    );
  }
}

class NewsPage extends StatefulWidget {
  const NewsPage({super.key});

  @override
  State<NewsPage> createState() => _NewsPageState();
}

class _NewsPageState extends State<NewsPage> {
  int _currentCircleIndex = 0;
  List<String> _circles = ['Blockchain', 'DeFi', 'NFT', 'DAO'];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Web3 News'),
        bottom: PreferredSize(
          preferredSize: Size.fromHeight(40),
          child: Container(
            height: 40,
            child: ListView.builder(
              scrollDirection: Axis.horizontal,
              itemCount: _circles.length,
              itemBuilder: (context, index) {
                return GestureDetector(
                  onTap: () {
                    setState(() {
                      _currentCircleIndex = index;
                    });
                  },
                  child: Container(
                    padding: const EdgeInsets.symmetric(horizontal: 16),
                    child: Text(_circles[index]),
                    decoration: BoxDecoration(
                      border: Border(
                        bottom: BorderSide(
                          color: _currentCircleIndex == index
                              ? Colors.blue
                              : Colors.grey,
                          width: 2,
                        ),
                      ),
                    ),
                  ),
                );
              },
            ),
          ),
        ),
      ),
      body: _getContentWidget(_currentCircleIndex),
    );
  }

  Widget _getContentWidget(int index) {
    switch (index) {
      case 0:
        return _getBlockChainContent();
      case 1:
        return _getDeFiContent();
      case 2:
        return _getNFTContent();
      case 3:
        return _getDAOContent();
      default:
        return Center(child: Text('Error'));
    }
  }

  Widget _getBlockChainContent() {
    return ListView.builder(
      itemCount: 5,
      itemBuilder: (context, index) {
        return ListTile(
          title: Text('Blockchain News ${index + 1}'),
          subtitle: Text('This is some blockchain news.'),
        );
      },
    );
  }

  Widget _getDeFiContent() {
    return ListView.builder(
      itemCount: 5,
      itemBuilder: (context, index) {
        return ListTile(
          title: Text('DeFi News ${index + 1}'),
          subtitle: Text('This is some DeFi news.'),
        );
      },
    );
  }

  Widget _getNFTContent() {
    return ListView.builder(
      itemCount: 5,
      itemBuilder: (context, index) {
        return ListTile(
          title: Text('NFT News ${index + 1}'),
          subtitle: Text('This is some NFT news.'),
        );
      },
    );
  }

  Widget _getDAOContent() {
    return ListView.builder(
      itemCount: 5,
      itemBuilder: (context, index) {
        return ListTile(
          title: Text('DAO News ${index + 1}'),
          subtitle: Text('This is some DAO news.'),
        );
      },
    );
  }
}