[Flutter] 상단 탭

 

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

import 'package:get/get.dart';

import '../controllers/party_controller.dart';

class PartyView extends GetView<PartyController> {
  const PartyView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return DefaultTabController(
      length: 3, // 탭의 수를 지정
      child: Scaffold(
        appBar: AppBar(
          title: Text('Daily Card', style: TextStyle(fontSize: 25.sp, fontWeight: FontWeight.w700, color: Colors.black)),
          actions: [
            Padding(
              padding: const EdgeInsets.only(right: 10),
              child: Image.asset('assets/images/storefront.png'),
            ),
            Padding(
              padding: const EdgeInsets.only(right: 15),
              child: Image.asset('assets/images/circle_notification.png'),
            ),
          ],
          centerTitle: false,
          backgroundColor: Colors.transparent,
          bottom: const TabBar(
            tabs: <Widget>[
              Tab(text: '오늘의 카드'),
              Tab(text: '오늘의 카드'),
              Tab(text: '기다리는 카드'),
            ],
          ),
        ),
        body: const TabBarView(
          children: <Widget>[
            Center(child: Text('탭 1의 내용')),
            Center(child: Text('탭 1의 내용')),
            Center(child: Text('탭 2의 내용')),
          ],
        ),
      ),
    );
  }
}