★★★트러블 슈팅

Flutter의 Sliver 시스템에서는 위젯 타입 간의 호환성 규칙

흑백 개발자 2024. 11. 19. 14:58
728x90

문제는 WeatherProductRecommendationWidget이 SliverList를 반환하는데, 이것을 SliverToBoxAdapter 안에 넣으려고 해서 발생했습니다. 수정된 코드를 보여드리겠습니다:

  1. WeatherScreen.dart의 CustomScrollView 부분을 다음과 같이 수정:
CustomScrollView(
  slivers: [
    SliverToBoxAdapter(
      child: WeatherWidget(),
    ),
    SliverToBoxAdapter(
      child: LocationWidget(),
    ),
    SliverToBoxAdapter(
      child: WeatherStatsSection(),
    ),
    // SliverToBoxAdapter를 제거하고 직접 위젯을 넣습니다
    WeatherProductRecommendationWidget(),
  ],
),

2. WeatherProductRecommendationWidget 수정:

핵심 변경사항:

  1. WeatherScreen에서 SliverToBoxAdapter 제거
  2. WeatherProductRecommendationWidget이 SliverList를 반환하도록 수정
  3. 헤더와 그리드를 하나의 SliverList 안에 일반 위젯으로 포함

이렇게 수정하면 스크롤 관련 에러가 해결될 것입니다.

CopyRetry
 

Claude does not have the ability to run the code it generates yet.

 

/////////////////////////////////////////////////////////
 
 

Flutter의 Sliver 시스템에서는 위젯 타입 간의 호환성 규칙이 있습니다:

  1. SliverToBoxAdapter는 일반 위젯(RenderBox)을 Sliver로 변환해주는 어댑터입니다.
    • 즉, Column, Container 같은 일반 위젯을 CustomScrollView의 slivers 리스트에서 사용할 수 있게 해줍니다.
  2. SliverList는 이미 Sliver 타입이기 때문에:
SliverToBoxAdapter(
  child: SliverList(...) // 에러! Sliver를 일반 위젯으로 취급하려고 함
)

 

  • 이렇게 하면 타입 불일치 에러가 발생합니다.
  • 3올바른 사용법:
     
CustomScrollView(
  slivers: [
    SliverToBoxAdapter(
      child: Container(...) // OK! 일반 위젯
    ),
    SliverList(...) // OK! 직접 Sliver 사용
  ]
)

 

따라서 Sliver 타입의 위젯은 SliverToBoxAdapter 없이 직접 CustomScrollView의 slivers 리스트에 추가해야 합니다. 이것이 Flutter의 렌더링 시스템이 작동하는 방식입니다.

728x90