본문 바로가기

프로그래밍/Flutter-Dart76

[Flutter] Kakao Map api 사용하기 카카오 developer 사이트 바로가기 카카오계정 accounts.kakao.com [ + 애플리케이션 추가하기] 클릭 앱 이름, 사업자명 입력 후 저장 그럼 다음과 같이 리스트에 애플리케이션이 추가된 것을 확인 가능. 생성된 애플리케이션 클릭 여기서 네이티브앱 키 메모해두고, [플랫폼 설정하기] 클릭 [Android 플랫폼 등록] 클릭 패키지명과 키 해시 입력 후 저장 아래와 같이 Android 플랫폼이 등록된 것을 확인 가능 해시 키 값은 아래를 참고하면 된다. https://developers.kakao.com/docs/latest/ko/getting-started/sdk-android-v1 Kakao Developers 카카오 API를 활용하여 다양한 어플리케이션을 개발해보세요. 카카오 로그인,.. 2022. 3. 10.
[Flutter] Navigator.pop 데이터 전달하기 생각보다 간단하다! 우선 A 페이지에서의 버튼을 구현해보자 //A bool _state = false; ElevatedButton( onPressed: () async { bool state = await Navigator.push(context, MaterialPageRoute(builder: (context) => B())); setState(() { _state = state; }); }, ... ) 여기서 중요한건 async와 await 이다! B 페이지에서는 다음과 같이 구현하면 된다. ElevatedButton( onPressed: () { ... Navigator.pop(context, true); }, ... ) 2022. 3. 10.
[Flutter] endDraw + AppBar actions 함께 쓰기 endDraw를 쓰고 appbar actions에서 action들을 추가하면 endDraw가 안보이게 된다. 그래서 찾아낸 방법은 Scaffold를 커스터마이징 하는 것! class CustomScaffold extends Scaffold { static GlobalKey _keyScaffold = GlobalKey(); CustomScaffold({ AppBar appBar, Widget body, Widget floatingActionButton, FloatingActionButtonLocation floatingActionButtonLocation, FloatingActionButtonAnimator floatingActionButtonAnimator, List persistentFooterButt.. 2022. 3. 10.
[Flutter] AppBar Module appbar에 action 들을 추가하니 코드가 가독성이 떨어져 보여 모듈화해서 빌드해보았다. import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; class AppBarArea extends StatelessWidget implements PreferredSizeWidget { final AppBar appBar; const AppBarArea({Key key, this.appBar}) : super(key: key); @override Widget build(BuildContext context) { return AppBar( backgroundColor: Colors.white, leading: Image.a.. 2022. 3. 10.
[Flutter] Splash 화면 pubspec.yaml dependencies: flutter_native_splash: ^1.1.8+4 projet_name\flutter_native_splash.yaml 생성 flutter_native_splash: image: assets/images/logo.png fullscreen: true 패키지 실행 (cmd 창) flutter pub run flutter_native_splash:create splash.dart class Splash extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( body: Center( child: Image.asset( "assets/images/log.. 2022. 3. 8.
[Flutter] 네이버 Maps API 사용하기 네이버 지도 api 사이트 바로가기 NAVER CLOUD PLATFORM cloud computing services for corporations, IaaS, PaaS, SaaS, with Global region and Security Technology Certification www.ncloud.com 위 링크를 통해 이동하면 아래와 같은 화면이 뜬다 여기서 중간에 보이는 [이용 신청하기] 버튼 클릭 그럼 다음과 같이 API 관련 페이지가 뜰 것이다. 물론, 로그인을 했다는 전제 하에. 스크롤을 내리다보면 맨 하단에 [ + Application 등록 ] 이라는 버튼이 보일 것이다. 클릭 약관 동의 약관 동의 후 Service 선택이 보일 것이다. 우선 뭐가 뭔지 모르니 Maps 를 체크해준다. 이.. 2022. 3. 8.
[Flutter] Google Map API 사용하기 하나하나 자세하게 알려주는 블로그가 없어 내가 직접 포스팅한다. 우선 Google Cloud Platform으로 이동하자! Google Cloud Platform 이동 Google Cloud Platform 하나의 계정으로 모든 Google 서비스를 Google Cloud Platform을 사용하려면 로그인하세요. accounts.google.com 그럼, 다음과 같이 상단에 Google Cloud Platform 옆 프로젝트 선택 스피너가 보일 것이다. 클릭하면 다음과 같이 프로젝트 선택 창이 뜬다 우측 상단 [새 프로젝트] 클릭 그럼 다음과 같이 프로젝트 이름 입력 란이 뜰 것이다. 아무렇게나 입력해도 상관 없는 듯 하다 입력 후 [만들기] 클릭 그럼 상단에 방금 만든 프로젝트 이름이 뜬 것을 확인할.. 2022. 2. 28.
[Flutter] Text, Icon, Image Text import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( home: Row( children: [ Text( 'Hey!', style: TextStyle( fontSize: 100, fontFamily: 'Futura', color: Colors.blue, ), ), Text( 'Hey!', style: TextStyle( fontSize: 30, fon.. 2022. 2. 16.
[Flutter] SizedBox, Spacer SizedBox 자식의 크기를 지정할 수 있다 import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( home: Row( children: [ BlueBox(), SizedBox( width: 200, height: 150, child: BlueBox(), ), BlueBox() ], ), ); } } class BlueBox extends StatelessWi.. 2022. 2. 16.
[Flutter] Flexible, Expanded Flexible import 'package:flutter/material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( home: Row( children: [ BlueBox(), Flexible( fit: FlexFit.loose, flex: 1, child: BlueBox(), ) ], ), ); } } class BlueBox extends StatelessWidget { @override Widget .. 2022. 2. 16.

티스토리툴바