Mobile 6

[Flutter] BottomNavigationBar의 splash 효과 제거 | BNB custom(2)

문제상황이전 포스팅인 BNB custom(1) 에서 시스템 네비게이션 바를 흰색으로 고정했다    근데 다시 검정 시스템 네비바로 바꿔서 보자면  눌렀을 때 플러터 BNB 자체의 기본적인 스플래시 효과로 인해 정신 사납다...스플래시를 조절하거나 없애는 것이 필요해보였다.    해결BottomNavigationBar 외부에 Theme으로 감싸서splashColor와 highlightColor를 투명인 Colors.transparent로 바꿔주면 된다. [간단 구조]컨테이너 ( 그림자 효과 (),    스플래시 효과 제거 (        커스텀 BNB ()    ))     [코드]Container( decoration: BoxDecoration( boxShadow: [ ..

Mobile 2024.11.29

[Flutter] systemNavigationBar 색상 변경 | BNB custom(1)

문제상황BottomNavigationBar(BNB) 디자인이 확정돼서 적용을 하려했는데디자이너 분 말씀으로는 인디케이터 공간까지 고려해서 BNB 공백을 타이트하게 잡았다고 하셨다.   IOS 기준으로는 별도의 설정 없이 systemNavigationBar가 알아서 BNB 배경색에 맞게 된다.   근데 Android (Pixel Phone) 기준으로는 라이트모드, 다크모드 상관없이 이렇게 떴다.삼성 폰 기준으로는 라이트 모드, 다크 모드 각각 흰색 검은색으로 떴다.   근데 우리가 12월 출시 때는 다크모드 고려안하고사용자 디바이스의 모드와 상관없이 라이트모드로 보이도록 하기로 했다. 따라서 저 시스템 네비게이션 바를 흰색으로 바꿔야하는 상황이다.   해결main.dart에 해당 코드를 추가하면 된다.@o..

Mobile 2024.11.29

[Flutter] WebView의 Local Storage 주입

문제 상황원래 각자 dev(fe) 서버에서 쓰는 테스트용 본인 계정이 있는데,나는 전자결재 모듈을 개발해야 했기 때문에테스트를 위해 기안자, 결재자 최소 두 명 이상의 계정이 필요했다. 다만 나는 ta 담당자였기 때문에 admin 계정까지 가지고 있었어서 총 두 개의 계정이 있긴 했다.하지만 멀티 테넌트 방식을 이용하고 있기 때문에admin 계정(qa 테넌트)과 개인 계정(개발 테넌트)의 테넌트가 달라서 같이 쓸 수 없는 상황이었다. 어차피 내 개인 계정도 관리자 권한이 있기 때문에 모바일 테스트용 신규 사용자 계정을 생성했었다. 그런데 어느날 우리 회사 슬랙 전체방에 이런 메세지가 올라왔다. 해당 계정으로 회사명이 없는 채 로그가 남아서 확인차 말씀해주신 것이라고 하셨다. 분명 이 계정에 회사 연결도 ..

Mobile 2024.11.13

[Flutter] 다이얼로그 내부에서 체크박스 사용하기 | StatefulBuilder 추가 | 상태 정보 관리 및 저장 방법 | FlutterSecureStorage

문제상황 AlertDialog 위젯 내부에 있는 Checkbox에 체크를 했는데,체크 표시가 반영 안되는 문제가 있었다.  Scaffold 위젯 body 내부의 Container에 있는 체크박스는위의 Checkbox 위젯의 코드와 다를게 없었지만 동일한 문제가 일어나지 않았다.  아마 Checkbox 위젯 코드 자체의 문제는 아닌 듯 했는데...   여기서 특이한 점은 체크박스 표시가 동작 자체를 아예 안하는 것이 아닌,x 표시를 눌러 다이얼로그를 닫았다가 다시 다이얼로그를 열면 체크가 반영이 되어있었다. 즉, 바뀐 체크 상태를 반영하기 위한 새로고침이 필요한 것이라고 판단했고 해결 방법을 찾아 보았다.  원인 [로그인 정보 저장 체크박스 위치]: Scaffold 내부의 Container 내부onChan..

Mobile 2024.10.15

[Flutter] 버튼 공백 지우기 | ElevatedButton와 GestureDetector 비교 | 위젯 분석

문제상황 '시작일' 컨테이너 내부의 아이콘 버튼들을 우측 끝에 두고 싶었다.저 버튼과 버튼을 둘러싼 컨테이너나 패딩 위젯에도 padding, margin 등의 속성에공백을 싹 줄였는데도 화면에선 공백이 있는 것처럼 보인다.  버튼을 꾹 눌러보면 그 버튼의 크기가 보이는데 분명 여백이 없어 보인다.   달력도 꾹 누르면 마찬가지로 저렇게 공백이 없다. 위젯 트리원인을 모르겠어서, 직접 저 공백의 출처를 밝혀내고자 위젯 트리에서 해당 위젯을 눌러 보기로 했다.  웹에서는 f12(개발자도구)를 키면 Elements 탭에서 select element to inspect 버튼을 통해해당 element를 눌러서 그 위치의 코드를 확인할 수 있다. TA 하면서 이 작업을 정말 많이 거쳤는데...모바일에서도 이 작업이..

Mobile 2024.10.08

[Flutter] 스크롤 할 때 app bar 색상 변경 이슈

문제 상황Flutter에서 app bar를 그대로 사용하면 스크롤 할 때 색깔이 변경되는 문제가 있다. [변경 전]  해결원인은 기본적으로 스크롤할 때 그림자가 지도록 설정 되어있기 때문에,그림자가 생기면서 색깔이 진해지는 것이다. 이를 해결하기 위해선 AppBar 안에 scrolledUnderElevation: 0 을 추가하면 된다.return Scaffold(    appBar: AppBar(        scrolledUnderElevation: 0, // 해당 부분 추가        ...    ),    ...);  [변경 후]  이제 "알림" title 부분 app bar는 색깔이 변하지 않는다!근데 아직 최상단 app bar는 스크롤 할 때 색상이 변한다. 이는 Home.dart 위젯 내부 ..

Mobile 2024.10.07