그림 그리기 3 (프로필)

import 'package:flutter/material.dart';

/// Flutter code sample for [TabBar].

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      theme: ThemeData(useMaterial3: true),
      home: const TabBarExample(),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    double width = MediaQuery.of(context).size.width;
    double gridBoxHeight = width / 3;
    int count = 30;
    double tabbarHeight = 50;
    double tabControllerHeight = tabbarHeight +
        (gridBoxHeight * ((count / 3) + (count % 3 > 0 ? 1 : 0)));

    return Scaffold(
      endDrawer: Container(
        width: 200,
        color: Colors.yellow,
      ),
      appBar: AppBar(
        leading: Icon(Icons.arrow_back_ios),
        title: Text("Profile"),
        centerTitle: true,
      ),
      body: ListView(
        children: [
          Padding(
            padding: const EdgeInsets.only(left: 20),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.start,
              children: [
                SizedBox(
                  width: 100,
                  height: 100,
                  child: CircleAvatar(
                    backgroundImage: AssetImage("assets/avatar.png"),
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.only(left: 30),
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Text(
                        "GetinThere",
                        style: TextStyle(
                          fontSize: 25,
                          fontWeight: FontWeight.w700,
                        ),
                      ),
                      Text(
                        "프로그래머/작가/강사",
                        style: TextStyle(fontSize: 20),
                      ),
                      Text(
                        "데어 프로그래밍",
                        style: TextStyle(fontSize: 15),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
          Padding(
            padding: const EdgeInsets.all(12),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceAround,
              children: [
                TagWidget("50", "Posts"),
                BlueLine(),
                TagWidget("10", "Likes"),
                BlueLine(),
                TagWidget("3", "Share"),
              ],
            ),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              //ElevatedButton(onPressed: () {}, child: Text("버튼1")),
              TextButton(
                onPressed: () {},
                child: Text("Follow"),
                style: TextButton.styleFrom(
                    backgroundColor: Colors.blueAccent,
                    foregroundColor: Colors.white,
                    minimumSize: Size(200, 40),
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(10),
                    )),
              ),

              OutlinedButton(
                onPressed: () {},
                child: Text("Message"),
                style: TextButton.styleFrom(
                    foregroundColor: Colors.black,
                    minimumSize: Size(200, 40),
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(10),
                    )),
              ),
            ],
          ),
          SizedBox(
            height: tabControllerHeight,
            child: DefaultTabController(
              initialIndex: 0, // 시작 인덱스 0
              length: 2,
              child: Column(
                children: [
                  const TabBar(
                    tabs: <Widget>[
                      Tab(
                        icon: Icon(Icons.directions_car_sharp),
                      ),
                      Tab(
                        icon: Icon(Icons.directions_subway),
                      ),
                    ],
                  ),
                  Expanded(
                    child: TabBarView(
                      children: <Widget>[
                        GridView.builder(
                          physics: NeverScrollableScrollPhysics(),
                          itemCount: count,
                          gridDelegate:
                              SliverGridDelegateWithFixedCrossAxisCount(
                                  crossAxisCount: 3),
                          itemBuilder: (context, index) {
                            return Image.network(
                              "https://picsum.photos/id/${151 + index}/100/100",
                              fit: BoxFit.cover,
                            );
                          },
                        ),
                        Center(
                          child: Text("It's sunny here"),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

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

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 2,
      height: 60,
      color: Colors.blue,
    );
  }
}

class TagWidget extends StatelessWidget {
  final text1;
  final text2;

  TagWidget(this.text1, this.text2);

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text("${text1}", style: TextStyle(fontSize: 15)),
        Text("${text2}", style: TextStyle(fontSize: 15))
      ],
    );
  }
}