inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

[코드팩토리] [중급] Flutter 진짜 실전! 상태관리, 캐시관리, Code Generation, GoRouter, 인증로직 등 중수가 되기 위한 필수 스킬들!

StateNotifierProvider 실습

탭바 이동후 다시 돌아가면 화면스크롤이 상단으로 이동하는 문제

353

ldsik03

작성한 질문수 4

0

bottom navigation bar의 4개 탭이 있는데

예를 들면 첫번째 탭인 홈탭에서 10페이지 정도 아래로 스크롤해서 내려간후

두번째 탭인 음식탭으로 이동한후 다시 첫번째 탭인 홈탭으로 돌아오면 화면 스크롤이 그대로 있는것이 아니라 가장 상단으로 이동되어 있습니다.

상단으로 이동되지 않고 그대로 있는 방법이 있을까요?

감사합니다.

flutter 하이브리드-앱

답변 1

1

코드팩토리

안녕하세요!

스크롤 포지션이 리셋되는 이유는 TabBarView 이동이 있을때마다 위젯이 새로 그려지기 때문입니다.

이걸 제한하고 위젯의 상태를 기억해두고싶다면 AutomaticallyKeepAliveMixin을 사용하면 됩니다.

아래 예제 코드를 첨부해드리겠습니다.

감사합니다!

import 'package:flutter/material.dart';

void main() {
  runApp(
    Root(),
  );
}

class Root extends StatefulWidget {
  const Root({Key? key}) : super(key: key);

  @override
  State<Root> createState() => _RootState();
}

class _RootState extends State<Root>{

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: DefaultTabController(
        length: 4,
        child: Scaffold(
          body: TabBarView(
            children: List.generate(
              4,
              (index) => Column(
                children: [
                  Expanded(
                    flex: 1,
                    child: Center(
                      child: Text(
                        'Page ${index + 1}',
                        style: TextStyle(
                          fontSize: 30,
                          fontWeight: FontWeight.bold,
                        ),
                      ),
                    ),
                  ),
                  Expanded(
                    flex: 2,
                    child: _List(),
                  ),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class _List extends StatefulWidget {
  const _List({Key? key}) : super(key: key);

  @override
  State<_List> createState() => _ListState();
}

class _ListState extends State<_List> with AutomaticKeepAliveClientMixin{
  @override
  Widget build(BuildContext context) {
    return  ListView.builder(
      itemBuilder: (_, index) => Center(
        child: SizedBox(
          height: 50,
          child: Text(
            index.toString(),
          ),
        ),
      ),
    );
  }

  @override
  // TODO: implement wantKeepAlive
  bool get wantKeepAlive => true;
}

Isar 마지막 업데이트는 2년전입니다.

0

31

0

FlutterSecureStorage 질문

0

32

0

Dio onError Interceptor 만드는 부분에 질문이 있습니다.

0

80

2

관리자 기능에 대한 질문

0

100

2

part 'restaurant_model.g.dart';

0

92

1

36강. dio 인터셉터에 storage를 전달하는 코드가 이해 안되는데요. 도움 부탁드립니다.

0

56

2

2번 반환 상황 관련 질문

0

61

2

riverpod 3.0

0

140

2

Asset folder??

0

83

2

디자이너와 협업 시 프레임 크기 설정 관련 질문

0

114

2

FutureProvider, StateNotifierProvider 선택 기준

0

70

2

컴포넌트 모델화

0

64

2

쿼리 파라미터

0

84

2

화면 안보임

0

68

2

PaginationListView

0

54

1

강의중 37.Dio onErrorInterceptor 작업하기 dio 관련 질문입니다.

0

103

2

프로토타입이미지

0

62

2

여러 객체를 상태 관리하는 방법에 대한 질문

0

85

2

장바구니 결제하기 응답이 500이 옵니다.

0

105

2

removeFromBasket에서 await patchBasket()을 마지막에 하면 에러나는거 아닌가요?

0

67

2

이 두가지는 완전히 동일한 기능인가요?

0

106

3

내부 코드를 작성하지 않은 CursorPaginationLoading가 어떻게 로딩상태를 갖는지 잘 모르겠습니다...

0

77

2

_SplashScreenState에서 storage를 late로 호출해서 한번만 불러와도 되나요?

0

86

2

코딩 작성 순서 관련 질문

0

88

2