Rust개발로그

Stack위젯으로 웹뷰 위에 container를 사용해서 배경을 transparent처리하면 웹뷰가 보이지만 웹이 컨트롤 되지 않는다.

floatingActionButton 처럼 웹뷰가 컨트롤 가능하고 커스텀 위젯 이벤트도 동작 가능하게 하려면??

Stack(
  children: <Widget>[
    Align(
      alignment: Alignment.bottomLeft,
      child: FloatingActionButton(...),
    ),
    Align(
      alignment: Alignment.bottomRight,
      child: FloatingActionButton(...),
    ),
  ],
)

scaffold의 옵션이 아니라 body 안에 floatingActionButton 을 커스텀 하면 된다.

https://stackoverflow.com/questions/50839282/how-to-add-multiple-floating-button-in-stack-widget-in-flutter?rq=1

BottomNavigationBar 사용 시, 탭을 이동 할 때마다 re-build되는 현상 발생.

리스트뷰를 스크롤해서 보다가 다른 탭 이동 후 다시 돌아오면 리스트가 초기화 되는 현상. 상태 유지 안됨.

이럴 때 IndexedStack 을 사용하면 쉽게 해결 가능하다. 

class Tabbar extends StatefulWidget {
  Tabbar({this.screens});

  static const Tag = "Tabbar";
  final List<Widget> screens;
  @override
  State<StatefulWidget> createState() {
  return _TabbarState();
  }
}

class _TabbarState extends State<Tabbar> {
  int _currentIndex = 0;
  Widget currentScreen;

  @override
  Widget build(BuildContext context) {
    var _l10n = PackedLocalizations.of(context);

    return Scaffold(
  body: IndexedStack(
    index: _currentIndex,
    children: Widget[
    	Widget1(),
        Widget2(),
        Widget3()
    ],
  ),
  bottomNavigationBar: BottomNavigationBar(
    fixedColor: Colors.black,
    type: BottomNavigationBarType.fixed,
    onTap: onTabTapped,
    currentIndex: _currentIndex,
    items: [
      BottomNavigationBarItem(
        icon: new Icon(Icons.format_list_bulleted),
        title: new Text(_l10n.tripsTitle),
      ),
      BottomNavigationBarItem(
        icon: new Icon(Icons.settings),
        title: new Text(_l10n.settingsTitle),
      )
    ],
  ),
);
  }

  void onTabTapped(int index) {
    setState(() {
      _currentIndex = index;
    });
  }
}

setState()에서 현재 인덱스 값만 변경해주면 된다.

https://stackoverflow.com/questions/52598900/flutter-bottomnavigationbar-rebuilds-page-on-change-of-tab

1. pubspec.yaml 을 연다.

2. dart의 print 관련 라이브러리인 sprintf 를 사용하고자 한다.

https://developermemos.com/posts/using-sprintf-flutter-dart 

dependencies:
  flutter:
    sdk: flutter
  sprintf: ^4.0.2

위와 같이 디펜던시 영역에 추가 후,,

3. 플루터 프로젝트 workspace로 이동

$> flutter pub get 

1. 플루터 sdk 다운로드

https://flutter.dev/docs/get-started/install/windows

- 적당한 곳에 압축을 풀어주고 해당 경로를 path로 잡아야 함.

$>flutter

2. 안드로이드 스튜디오 다운로드

https://developer.android.com/studio?hl=ko

- 스튜디오 설치 후, plugins에서 flutter install

- flutter 샘플 프로젝트 생성

- AVD manager에서 적당한 디바이스 생성 (nexus5x os pie)

- AVD manager에서 해당 디바이스 실행

- 실행 시 오류 발생. (라이센스 동의를 하지 않았다는 뭐 대충 그런 내용)

- settings - android sdk - sdk Tools - Google Play Licensing Library 설치

- 실행 시 flutter 샘플 화면 작동.