개발자

Scrollview 안에 Webview 사용 문제

2023년 05월 07일조회 625

제목처럼 ScrollView 안에서 Webview를 사용할때 터치하는 영역이 스크롤뷰인지 웹뷰인지에 따라 해당 컴포넌트만 스크롤이 되는데 터치하는 영역 상관없이 둘다 스크롤처리가 동시에 가능하도록 할 수 있을까요??

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 3

엄홍재님의 프로필 사진

webview를 사용해본적이 없어서 해당 컴포넌트를 ScrollView에 넣어본 적은 없지만 스크롤과 관련해서 비슷한 이슈를 경험해 본적은 있습니다. 해당 이슈는 FlatList를 ScrollView 안에서 사용할 때 스크롤이 안되는 이슈가 있는 것인데요. 이건 안드로이드에서 발생하고 이를 해결하기 위해 nestedScrollEnabled props를 사용할 수 있습니다. (관련 링크: https://careerly.co.kr/qnas/901) 근데 질문자님은 FlatList가 아니고 webview컴포넌트라서 정확한 해결법은 안되겠네요.... 그냥 참고차 비슷해보여서 남겨 놓습니다!

KHS님의 프로필 사진

https://pub.dev/packages/extended_sliver#slivertonestedscrollboxadapter 위 플러그인 쓰면 어느정도 완벽하진 않지만 해결은됩니다..

커리어리 AI 봇님의 프로필 사진

일반적으로 ScrollView 안에 WebView를 넣는 것은 권장되지 않습니다. 그 이유는 ScrollView와 WebView가 모두 자체적으로 스크롤 동작을 처리하기 때문에, 두 컴포넌트가 서로 충돌할 수 있기 때문입니다. 이를 해결하기 위한 방법으로는 두 가지가 있습니다. 1. WebView를 ScrollView 밖으로 이동: 가능하다면, WebView를 ScrollView 바깥으로 이동시키는 것을 고려해 보세요. 이렇게 하면 WebView와 ScrollView의 스크롤 동작이 서로 충돌하는 것을 피할 수 있습니다. 2. NestedScrollView 사용 (안드로이드): 안드로이드에서는 NestedScrollView를 사용하여 ScrollView 안에 있는 WebView의 스크롤 동작을 처리할 수 있습니다. NestedScrollView는 자식 뷰의 스크롤 동작을 부모 뷰와 동기화할 수 있습니다. 하지만 이 방법은 안드로이드에서만 작동하며, iOS에서는 작동하지 않습니다. 그러나 WebView와 ScrollView를 함께 사용하면 여전히 문제가 발생할 수 있습니다. 따라서, 가능한 한 WebView를 ScrollView 바깥으로 이동시키는 것이 가장 좋은 해결책일 수 있습니다. 더 나은 답변을 드리기 위해 사용하고 있는 플랫폼(안드로이드, iOS)과 프레임워크(React Native, Flutter 등)에 대한 정보를 제공해주시면 감사하겠습니다.

커리어리 AI 봇의 답변을 평가해 주세요!

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로
키워드로 질문 모아보기

실무, 커리어 고민이 있다면

새로운 질문 올리기

지금 가입하면 모든 질문의 답변을 볼 수 있어요!