본문 바로가기

CS

 (143)
Named Route - PushNamed Flutter PushNamed 데이터 주고 받기 PushNamed()를 사용하면 MaterialPageRoute()를 사용하지 않기 때문에 MaterialPageRoute()의 setting 값을 사용할 수 없다 이 경우 값 전달은 PushNamed()가 가지고 있는 arguments 기능으로 바로 넘겨줄 수 있다 Named Route 사용하면 argument를 사용하는 방법이 데이터 주고 받는 가장 쉬운 방법이다 initialRoute: 초기 페이지 지정 routes{}에 위 처럼 Route를 지정해준다 pushNamed()에 RouteThree Screen 라우트와 argument(999)를 주었다 final argument = ModalRoute.of(context)!.settings.argume..
layout 이용해 코드 중복제거하기 layout 이용해 코드 중복제거하기 중복되는 코드를 main_layout.dart 파일로 따로 생성해준다 해당 코드 안에서 중복되지 않는 변수들은 아래처럼 정의해준다 class MainLayout extends StatelessWidget { final String title; final List children; const MainLayout({required this.title, required this.children, Key? key}) : super(key: key); Navigator를 이용해 Home Screen에서 Push 버튼을 누르면 RouteOne Screen으로 넘어가고 Pop 버튼을 누르면 다시 Home Screen으로 돌아온다
Flutter Button 스타일링 - ElevatedButton, OutlinedButton, TextButton Material State - hovered: 마우스 커서 올려놓은 상태 - foucused: 포커스됐을 때(텍스트 필드) - pressed: 눌렸을 때 - dragged: 드래그됐을 때 - selected: 선택됐을 때 - scrollUnder: 다른 컴포넌트 밑으로 스크롤링됐을 때 - disabled: 비활성화됐을 때 - error: 에러 상태 Flutter Button Styling ElevatedButton #1 styleFrom() 사용하지않고 MaterialStateProperty 사용 시 MaterialStateProperty.all()은 Colors.색상 MaterialStateProperty.resolveWith()는 위와 같이 (Set states){}를 써주어야 한다 기본값은 retu..
랜덤 숫자 생성기 먼저 구현 하고싶은 레이아웃대로 설정해주기 Expanded( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: [ Text("123"), Text("456"), Text("789"), ], ), ), 나머지 부분들을 숫자 부분이 차지할 것이기에 Expanded로 묶어준다 Container( width: double.infinity, child: ElevatedButton(onPressed: () {}, child: Text("생성")), ), double.infinity 이용해 버튼 너비를 무한히 늘려줄 수 있다 Container 아닌 SizedBox로 묶어줘도 되지만 그럴 경우 버튼 색상 바꾸는 등의 다른 기능은 구현하지 못하고..
const constructor import 'package:flutter/material.dart'; class HomeScreen extends StatefulWidget { const HomeScreen({super.key}); @override State createState() => _HomeScreenState(); } class _HomeScreenState extends State { @override Widget build(BuildContext context) { return Scaffold( body: Container( width: MediaQuery.of(context).size.width, child: Column( mainAxisAlignment: MainAxisAlignment.center, children..
커플 디데이 어플 만들기 프로젝트에서 사용할 글씨체 다운 https://fonts.google.com/?subset=korean Browse Fonts - Google Fonts Making the web more beautiful, fast, and open through great typography fonts.google.com asset은 이렇게 구성해준다 텍스트 부분과 이미지 부분 상, 하 부분으로 나눠 진행 -> Column "The First Day We met" 부분과 "2022. 9. 17" 부분은 줄 간격을 띄우고 싶지 않기에 둘은 또 안에 Column으로 묶어준다 텍스트들과 아이콘 부분 전체의 Column을 Expanded하고 mainAxisAlignment의 spaceEvenly 이용해 간격 적절히 넓혀준다..
Dart DateTime 디데이앱에서 활용할 DateTime은 요롷게....🙃
Photo Slide Show App Photo Slide Show APP PageView 이용해 사진 보여주기 손짱 사진으루,, 사진 이름이 son1.png, son2.png 등으로 끝에 숫자만 반복됨 -> functional programming 해주기 fit: BoxFit.cover 이용해 사진 확대해 전체화면으로 보여지게 하기 Timer 타이머 걸어주기 timer = Timer.periodic(Duration(seconds: _), (timer) {} 초기 페이지 값은 0 currentPage와 nextPage 설정해줬고 다음 페이지값이 위 예시에서는 3보다 커질 경우 다시 초기 페이지로 돌아오게 했다 (위 예시에서는 사진을 총 4장 넣어줬기 때문) 페이지에 애니메이션 효과를 주었는데, (animateToPage) curve 값을 조..
Tiny Star

티스토리툴바