[flutter] 스택드 위젯을 사용하여 시험 스터디 앱 화면 구성하기
아래는 시험 스터디 앱의 화면을 구성하는 예시 코드입니다.
import 'package:flutter/material.dart';
void main() {
runApp(MyStudyApp());
}
class MyStudyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('시험 스터디 앱'),
),
body: Stack(
children: <Widget>[
Container(
color: Colors.blue,
height: 200,
),
Positioned(
top: 50,
left: 20,
child: Text(
'시험 일정',
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
),
),
Positioned(
top: 100,
left: 20,
child: Text(
'과목 별 시험 일정 표시',
style: TextStyle(fontSize: 16),
),
),
Positioned(
bottom: 20,
right: 20,
child: ElevatedButton(
onPressed: () {
// 버튼 클릭 시 동작 설정
},
child: Text('더 보기'),
),
),
],
),
),
);
}
}
위의 예시 코드는 시험 스터디 앱의 화면을 구성하는 데에 스택 위젯을 사용한 예시입니다. 스택 위젯을 사용하여 배치와 레이아웃을 다양하게 구성할 수 있습니다.
더 다양한 스택 위젯의 활용 방법과 기능은 Flutter 공식 문서를 참고하시기 바랍니다.