전체 글 (30) 썸네일형 리스트형 [Flutter] Getx Dialog Getx를 통해 많이 사용하는 기능중 하나가 Get.dialog() 입니다. Flutter에서 material의 기능 중 showDialog를 통해 dialog를 만들 수 있지만, 제 생각에는 2가지 단점이 있는 것 같습니다. 1. 너무 안드로이드스러운 UI로 인해 iOS앱에서는 뭔가 어색해 보입니다. 아이폰에서 안드로이드를 사용하는 듯한 느낌이 들죠. 2. 1번과 연결되는 내용이지만 customizing한 dialog를 만들기 어려운 단점이 있습니다. 앱의 기능에 따라 본인만의 dialog가 필요한 경우가 있기 때문이죠. Getx를 통한 다이얼로그는 아래 코드로 간단하게 다이얼로그를 띄울 수 있습니다. Get.dialog( const Dialog( child: Text('Getx Dialog'), ) .. [Flutter Web] PaginatedDataTable Row Height 조정 PaginatedDataTable을 사용하다 보니 행의 간격을 조정해야 할 일이 생겼다. 찾아보니 dataRowHeight 필드를 통해 조정이 가능하다. 기본값은 48로 되어 있으니 참고하시길.. dataRowHeight: 60 PaginatedDataTable( source: _allUsers, header: const Text('Users'), columns: const [ DataColumn(label: Text('profile')), DataColumn(label: Text('Nickname')), DataColumn(label: Text('Uid')), DataColumn(label: Text('Grade')) ], dataRowHeight: 60, columnSpacing: 100, horiz.. [Flutter] Debug Mode Banner 없애기 에뮬레이터 또는 폰에서 디버그 모드로 실행때 우상단에 Debug mode banner 가 있습니다. 개발중일 때는 상관없지만 스크린샷을 찍거나 할때는 신경쓰이는 부분이죠. 이 배너는 없애는 방법은 MaterialApp 또는 GetMaterialApp 의 debugShowCheckedModeBanner 속성을 false 로 변경해주시면 됩니다. return GetMaterialApp( debugShowCheckedModeBanner: false, title: 'Flutter Demo', initialBinding: InitBinding(), initialRoute: '/', getPages: [ GetPage(name: '/', page: () => const Home()), GetPage(name: '/.. [Flutter] Getx Route Management Getx를 사용하면 보다 직관적인 Route 를 관리할 수 있습니다. 오늘은 많이 사용하는 Getx Route Management 에 대해서 정리해 보겠습니다. Getx 라우트는 동일 기능을 2가지 방법으로 제공하고 있습니다. 1. 다음 라우트를 클래스명을 지정하는 방법 2. 이름있는 라우트를 통한 방법 : Named를 포함하는 함수명을 사용합니다. 많이 사용하는 라우트 방법을 정리하면 다음과 같습니다. ○ Get.to() & Get.toNamed() - 단순하게 가장 많이 사용하는 다음페이지로 이동 ○ Get.back() - 현재 페이지에서 뒤로 가기 ○ Get.until() - 특정 조건이 만족될까지 뒤로 가기 ○ Get.off() & Get.offNamed - Current route를 삭제하고 지.. [Flutter] Getx 상태관리(3) - bottonNavigationBar+initialBinding 실제 앱에서 사용할만한 상태관리 예제로 Scaffold 의 bottonNavigationBar 의 인덱스를 전역에서 사용하는 예제를 만들어 보려고 합니다. 요즘 앱에서 많이 사용하는 bottonNavigationBar 의 형태를 Flutter 에서는 Scaffold를 통해서 간단히 만들 수 있습니다. 이제 bottom navigation bar 가 있는 앱을 만들어 보겠습니다. 역시나 저는 MaterialApp 대신에 Getx의 기능을 사용하기 위해 GetMaterialApp으로 시작해 보겠습니다. class _MyHomePageState extends State { @override Widget build(BuildContext context) { return GetMaterialApp( title: .. [Flutter] Getx 상태관리(2) Get.find() 지난 예제를 통해서 Flutter 의 기본 프로그램인 더하기 프로그램을 Getx 를 통해서 변경해 보았습니다. https://alsmaker.tistory.com/33 [Flutter] GetX 상태관리(1) - GetxController, Get.put() Flutter 에서 GetX 패키지는 이제 정말 없어서 안될 패키지인것 같습니다. GetX에서 가장 많이 사용하는 기능은 크게 상태관리와 Routing일 것 같습니다. GetX 에 대한 자세한 정보는 아래 링크에서 보시 alsmaker.tistory.com 하지만 단일 페이지의 프로그램은 존재할 수가 없겠죠. 이제 단일 페이지가 아니라 Routing 을 통해서 다른 페이지로 이동하는 경우에 사용했던 Controller 를 어떻게 활용할지 알아보겠습니.. [Flutter] GetX 상태관리(1) - GetxController, Get.put() Flutter 에서 GetX 패키지는 이제 정말 없어서 안될 패키지인것 같습니다. GetX에서 가장 많이 사용하는 기능은 크게 상태관리와 Routing일 것 같습니다. GetX 에 대한 자세한 정보는 아래 링크에서 보시면 됩니다. https://pub.dev/packages/get get | Flutter Package Open screens/snackbars/dialogs without context, manage states and inject dependencies easily with GetX. pub.dev 그래서 우선 상태관리에 대해서 먼저 정리를 해보겠습니다. 첫번째로 GetX 패키지를 우리 프로젝트에 추가해 보겠습니다. $ flutter pub add get pubspec.yaml 파일을 .. [Flutter Web] "Failed to load network image" CORS 해결 Flutter App에서 정상적으로 사용하던 Widget을 가져와서 이미지 로딩을 해보았다. 왠걸.. App에 수도없이 박혀있는 이미지 로딩 코드가 이상한 에러를 뱉어낸다. 보기 싫은 X자 이미지와 함께.. App에서는 주로 경로가 안 맞아 발생하는 에러여서 이미지 경로를 찾아보니, 브라우저에서 정상적으로 이미지를 로딩하고 있다. Flutter 공식문서를 찾아보니.. Flutter는 웹에서 두 가지 렌더러를 선택할 수 있습니다. HTML : 이 렌더러는 HTML, CSS, Canvas 2D 및 SVG의 조합을 사용하여 UI를 렌더링합니다. 요소를 사용하여 이미지를 렌더링합니다. CanvasKit : 이 렌더러는 WebGL을 사용하여 UI를 렌더링하므로 이미지의 픽셀에 액세스해야 합니다. 이런 설명이 나온.. 이전 1 2 3 4 다음
