Flutter (29) 썸네일형 리스트형 flutter) dart math패키지사용하기, 문자열+변수 사용하기 js에서는 백틱을 이용해 js 변수명과 함께 표현할 수 있다. let test = 'hello'; let result = `${test} world!`; console.log(result); // hello world! dart에서도 비슷하게 사용할 수 있다. var a = '나는'; var result = '$a 탐훈입니다'; pring(result); // 나는 탐훈입니다 js dart `${변수명}` '$변수명' import 'package:flutter/material.dart'; import 'dart:math'; final randomizer = Random(); // 랜덤 함수 final로 할당함 class DiceRoller extends StatefulWidget { @override S.. flutter) StatefulWidget으로 re-excute build하기 Roll Dice 버튼을 누르면 이미지가 변경 되도록 만들었다. 그런데 실행은 되지만 이미지 변경이 되지 않았다. 그 이유는 StatelessWidget을 상속했기 때문이다 DiceRoller라는 이름으로 파일로 따로 빼서 StatelessWidget이 아닌 StatefulWidget을 상속하여 데이터가 변경될 시에 re build를 하도록 만들어보자 1. 파일을 만든다. 2. StatefulWidget을 상속한 클래스, State를 상속한 클래스 두가지를 만든다. 이렇게 해도 메소드작동이 안된다... 그 이유는... setState를 쓰지 않았기 때문이다 State를 상속한 클래스에서 setState 메소드를 사용하여 변수 값을 바꿔주면 update할 녀석들을 re-excute build 해준다. flutter) 위젯 중앙으로 배치, 사진과 버튼 사이 간격 주기 지금 주사위 위치를 Y축 중앙으로 두려면? Column 위젯 한 덩어리 안에서 속성을 이용해 Y축 중앙 배치한다. 사진과 버튼 텍스트 사이에 간격 주는 방법은 두가지가 있다. 1. TextButton의 style 속성 안에 padding속성으로 조절한다. 2. 이미지 위젯과 버튼 위젯 사이에 SizedBox 위젯 넣어주기 각자의 차이 SizedBox padding 다른 위젯의 크기를 건드리지 않고 띄워줌 위젯의 크기가 늘어나면서 띄워줌 flutter) TextButton으로 클릭이벤트 달기 Container 위젯에 child를 여러개 붙일 수 없다. 그래서 child에 Column 위젯을 넣는다. Column위젯에 children속성에는 여러개 위젯을 붙일 수 있다. flutter) 이미지 등록하여 Image 위젯으로 사진 등록해보기 1.assets 폴더 밑 images 폴더 안에 이미지 파일을 저장한다. 2. pubspec.yml 파일에서 assets 부분을 주석 해제한 뒤 추가한 파일을 넣어준다. 3. 사용할 곳에서 Image 위젯의 asset 메소드를 이용해 이미지 넣어주기 flutter) 커스텀 위젯에 인수를 받아 사용하기 Hello World는 하드코딩 되어 있다. 요걸 인수로 받아서 넣어 사용해보자 위의 방법은 조금 복잡하다. 더 쉽게 인자를 받자마자 class 내부 값으로 바로 받는 방법이 있다 const StyledText(this.innerText, {super.key}) 생성자의 인자로 받는 부분에 this를 붙여주면 클래스내부 변수와 바로 일치시킨다. flutter) var가 아닌 다른 타입을 사용하여 변수할당하기 startAlignment 변수명에 마우스를 올리면 타입이 Alignment로 나온다. 해당 타입으로 할당해보자 이상이 없다. 그런데 Alignment를 생성할 때 초기화값을 주지않고 사용한다면? 한마디로 null값을 줘버리고 변수명만 잡는다면 ? non-nullable이다. 이럴 땐 어떻게 해야될까? Alignment? 변수명; 이렇게 하면 된다! 그런데 gradient 의 beign과 end속성에는 non-nullable 속성을 갖기 때문에 var로쓰자.. ㅋㅋㅋ flutter) 변수 할당하여 사용해보기 그라디언트시작과 끝 부분의 Alignment... 으로 처리하였는데 이 두가지를 변수로 할당하여 처리해보자 const를 지우니 에러가 사라졌다! import 'package:flutter/material.dart'; import 'package:practice/styled_text.dart'; var startAlignment = Alignment.topLeft; var endAlignment = Alignment.bottomRight; class GradientContainer extends StatelessWidget { const GradientContainer({super.key}); @override Widget build(context) { return Container( decoration:.. 이전 1 2 3 4 다음
