Flutter/Flutter Tech

    [플러터] Splash 화면 변경하기 (로딩 화면)

    [플러터] Splash 화면 변경하기 (로딩 화면)

    Splash 앱을 실행하면 몇 초간 앱의 로고를 출력하는 로딩 스크린을 마주할 것이다. 플러터 앱을 에뮬레이터에서 디버깅을 할 때에는 잘 보지 못하지만, 실 기기에서 테스트시에는 앱 실행 전 하얀 blank 화면이 몇 초간 출력됨을 확실히 볼 수 있다. (가벼운 네이티브 앱은 로딩이 거의 존재하지 않는다.) 이를 Splash 스크린이라고 하는데, 칙칙한 blank 화면을 간단한 방법으로 산뜻하게 바꿔보자. 방법 플러터 프로젝트에서 아래의 경로로 찾아간다. android > app > src > main > res > drawable > launch_background.xml 이 xml 파일이 splash 화면 그 자체이다. drawable 폴더에 원하는 로고 이미지를 넣은 후 아래와 같이 코드를 변경해보..

    [플러터] Stateful Class 내부에 접근하기

    State Class 플러터의 Stateful 클래스는 State와 Stateful Widget 두 가지의 클래스가 생성되는데, 기본으로 State 클래스가 private으로 정의된다. 일반적으로 변수와 함수를 build가 존재하는 State 클래스에 정의하게 되는데, 이렇게 정의된 것들은 외부에서는 사용할 수 없다. 이를 사용하기 위해서 기본 위젯 Stream을 활용하거나 패키지 GetX를 사용하긴 하지만 이 것들을 사용하고 싶지 않을 수도 있다. 이 포스팅에서는 State 클래스 내부에 접근할 수 있는 근본적인 방법을 설명한다. 이전에 자식 클래스에서 부모 클래스의 데이터에 접근하는 방법을 포스팅 한 적이 있는데, 이 방법을 사용해도 무방하다. 접근하기 class MyStatefulWidget ext..

    [플러터] 파일을 cache 저장소에 저장하기

    앞서 이미지를 캐시 저장소에 저장하고 빠르게 불러오는 방법을 포스팅했다. [플러터] 이미지를 cache 저장소에 저장하기 스마트폰을 사용하다보면 앱의 저장공간에 캐시라는 공간이 별도로 존재하는 것을 보았을 것이다. cache(캐시)라고 불리는 것에는 cache 저장소와 cache memory 2가지가 있다. cache란 데이터를 빠르게 muhly.tistory.com 이번에는 파일을 캐시 저장소에 저장하는 방법을 포스팅하겠다. Cache 저장소 (파일) 앞선 포스팅에서 이미지를 캐시 저장소에 저장할 때 사용했던 패키지는 'cached_network_image' 로 오늘 소개할 패키지의 일부분으로 이미지만을 위해 편리하게 사용하게끔 분리시켜놓은 패키지이다. 따라서, 이 포스팅의 패키지로 이미지의 캐시 저장..

    [플러터] 이미지를 cache 저장소에 저장하기

    스마트폰을 사용하다보면 앱의 저장공간에 캐시라는 공간이 별도로 존재하는 것을 보았을 것이다. cache(캐시)라고 불리는 것에는 cache 저장소와 cache memory 2가지가 있다. cache란 데이터를 빠르게 불러오기 위해 할당된 공간이라고 생각하면 된다. 오늘은 이미지를 cache 저장소에 저장하는 방법을 알아본다. cache memory에 이미지를 올려두는 방법은 다음 글에서 포스팅하겠다. Cache 저장소 서버와 같이 네트워크에 존재하는 이미지를 Image.network()로 호출한다면 매번 서버에 접속해야한다. 하지만 서버와의 통신시간은 짧지 않아 로딩이 발생하고 그에 따른 비용도 발생한다. 그래서 일반적으로 서버에 접속해서 이미지를 최초 1회만 호출을 하고 이후에는 사용자 기기(로컬)의 ..

    [플러터] 위젯의 크기&위치를 반환받는 법

    플러터에서 특정 위젯의 크기와 위치를 반환 받는 방법은 아래와 같다. 코드 //GlobalKey를 선언한다. GlobalKey _viewKey = GlobalKey(); void initState(){ //Build가 실행되어 위젯이 그려진 후 해당 함수가 실행된다. WidgetsBinding.instance.addPostFrameCallback((timeStamp) { _getSize(); }); } _getSize(){ //위젯 key로 RenderBox를 정의한다. RenderBox _viewBox = _viewKey.currentContext.findRenderObject(); Offset offset = _viewBox.localToGlobal(Offset.zero); //위젯의 좌표를 반환받는..