반응형
https://www.fluttercampus.com/guide/129/how-to-create-onboarding-intro-screen-sliders-on-flutter/
위 링크를 참고를 했다.
기본적인 코드는 아래와 같다.
필수적인 요소가 있다.
title, body를 꼭 넣어줘야 한다.
UI구성 순서는
image
title
body
순서이다.
위 순서를 바꿀 수 있는지는 잘 모르겠다.
그래도 그냥 내용만 입력하면 편하다..!!
잘 적용된 모습..!
IntroductionScreen(
globalBackgroundColor: Colors.green,
//main background of screen
pages: [
//set your page view here
PageViewModel(
title: '부까 사용 안내',
body: " 연매출 10억 이하 매장만 \n사용 권장합니다! \n "
"\n 세금을 드라마틱 하게 줄여주는 \n계산기가 아닙니다.",
image: Image.asset(
'assets/image/001.png',
fit: BoxFit.fill,
),
decoration: pageDecoration,
),
PageViewModel(
title: "계산된 예상 부가세와 실제 부가세가 차이나는 경우",
body: ""
"\n"
"가.신용카드공제 23년 연말까지 \n1000만원 한도\n"
"\n"
"나.놓친 지출 증빙 자료가 있다.\n"
"\n"
"다.식자재 지출과 공산품 지출을 \n정확히 구분하지 않았다",
image: Image.asset('assets/image/002.png'),
decoration: pageDecoration,
),
PageViewModel(
title: "절세의 시작은 부가세입니다.",
body: "\n"
"사장님의 1년 부가세가 다음해의 종합소득세의 과세표준이 되며 종합소득세에 따라서 연금과 \n건강보험료가 측정됩니다.\n "
"\n절세의 시작은 부가세!",
image: Image.asset('assets/image/003.png'),
decoration: pageDecoration,
),
//add more screen here
],
onDone: () => goHomepage(context), //go to home page on done
onSkip: () => goHomepage(context), // You can override on skip
showSkipButton: true,
nextFlex: 0,
반응형
'Flutter-플러터 > 플러터 공부' 카테고리의 다른 글
Flutter 패키지 라이센스에 대해서 (0) | 2023.07.17 |
---|---|
Flutter 앱 빌드 하기 (0) | 2023.07.15 |
Flutter http 간단 요약 (0) | 2023.07.10 |
RestAPI - http 패키지 (0) | 2023.07.04 |
Provider context.read와 context watch 의 차이점 (0) | 2023.06.27 |