키보드가 나타나면 Flutter 위젯의 크기가 조정됩니다. 이것을 방지하는 방법?

다음과 같은 확장 위젯 열이 있습니다.

 return new Container(
      child: new Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: <Widget>[
          new Expanded(
            flex: 1,
            child: convertFrom,
          ),
          new Expanded(
            flex: 1,
            child: convertTo,
          ),
          new Expanded(
            flex: 1,
            child: description,
          ),
        ],
      ),
    );

다음과 같이 보입니다.

convertFrom, TextField를 포함합니다. 이 텍스트 필드를 탭하면 Android 키보드가 화면에 나타납니다. 이렇게하면 화면 크기가 변경되므로 위젯 크기는 다음과 같이 조정됩니다.

내 열의 크기가 조정되지 않도록 키보드를 화면에 "오버레이"하는 방법이 있습니까? Expanded위젯을 사용하지 않고 각 위젯의 높이를 하드 코딩하면 위젯 크기가 조정되지 않지만 키보드가 나타날 때 검정색과 노란색 줄무늬 오류가 발생합니다 (공간이 충분하지 않기 때문). 이것은 또한 모든 화면 크기에 유연하지 않습니다.

이것이 Android 전용인지 Flutter 전용인지 잘 모르겠습니다.

업데이트 된 답변

resizeToAvoidBottomPadding이제 더 이상 사용되지 않습니다 .

업데이트 된 솔루션은 resizeToAvoidBottomInset속성을 false.

원래 답변

당신의에서 Scaffold설정 resizeToAvoidBottomPadding속성을합니다 false.

대부분의 다른 답변은 resizeToAvoidBottomPadding=false. 내 경험상 키보드가 나타나는 위치 아래에있는 경우 키보드가 텍스트 필드를 가리도록합니다.

내 현재 해결책은 내 열을 화면과 같은 높이로 만든 다음 SingleChildScrollView키보드를 사용할 때 Flutter가 자동으로 내 화면을 충분히 위로 스크롤하도록 배치하는 것입니다 .

Widget build(BuildContext context) {
  return Scaffold(
    body: SingleChildScrollView(
      physics: NeverScrollableScrollPhysics(),
      child: ConstrainedBox(
        constraints: BoxConstraints(
          minWidth: MediaQuery.of(context).size.width,
          minHeight: MediaQuery.of(context).size.height,
        ),
        child: IntrinsicHeight(
          child: Column(
            mainAxisSize: MainAxisSize.max,
            children: <Widget>[
              // CONTENT HERE
            ],
          ),
        ),
      ),
    ),
  );
}

NeverScrollableScrollPhysics사용자가 자신을 스크롤 할 수 없도록 사용 합니다.

설정 resizeToAvoidBottomInset에 false대신 resizeToAvoidBottomPadding하는 사용되지 않습니다.

    return Scaffold(
      resizeToAvoidBottomInset : false,
      body: YourWidgets(),
    );

내 접근 방식은 물리학과 SingleChildScrollView함께 사용 하는 것 ClampingScrollPhysics입니다.

SingleChildScrollView(
  physics: ClampingScrollPhysics(),
  child: Container(),
)

방법 1 :android:windowSoftInputMode="adjustResize" AndroidManifest.xml 파일에서 제거 하고 (그렇지 않으면 flutter 코드를 재정의 함) resizeToAvoidBottomPadding: false아래와 같이 Scaffold를 추가 합니다.

Scaffold(
      resizeToAvoidBottomPadding: false,
      appBar: AppBar()
)

방법 2 (권장되지 않음) :android:windowSoftInputMode="stateVisible" Android AndroidManifest.xml을 활동에 추가 하면 Android에서만 작동하고 IOS에서는 작동하지 않습니다.

<activity
       ...
        android:windowSoftInputMode="stateVisible">

참고 : 설정하지 마십시오 .android:windowSoftInputMode="adjustResize"

@Aman의 솔루션을 구현하면 키보드가 나타날 때 앱이 추악하게 작동하고 사용 가능한 높이에 따라 화면의 뷰포트를 조정하지 않고 키보드 뒤에 숨어있는 다른 필드를 표시 할 것이라고 생각합니다. 그래서 SingleChildScrollView대신 사용을 제안합니다 .

SingleChildScrollView아래와 같이 코드를 감싸십시오 .

 return new Container(
  child: SingleChildScrollView(
    child: new Column(
    crossAxisAlignment: CrossAxisAlignment.stretch,
    children: <Widget>[
      new Expanded(
        flex: 1,
        child: convertFrom,
      ),
      new Expanded(
        flex: 1,
        child: convertTo,
      ),
      new Expanded(
        flex: 1,
        child: description,
      ),
    ],
  ),
 ),
);

내 제안은 resizeToAvoidBottomInset: false키보드가 갑자기 화면에 나타나면 위젯 크기가 조정되지 않도록 어쨌든 사용하는 것입니다. 예를 들어 사용자가 앱에서 Facebook 채팅 헤드를 사용하는 경우입니다.

키보드가 위젯을 오버레이하는 것을 방지하기 위해 필요한 화면에서 SingleChildScrollView사용 가능한 공간의 높이로 높이를 줄이는 방법을 제안합니다 . 이 경우 SingleChildScrollView포커스 된 위젯으로 스크롤합니다.

final double screenHeight = MediaQuery.of(context).size.height;
final double keyboardHeight = MediaQuery.of(context).viewInsets.bottom;
return Scaffold(
  resizeToAvoidBottomInset: false,
  body: SizedBox(
    height: screenHeight - keyboardHeight,
    child: SingleChildScrollView(
      child: Column(
        children: [
          const SizedBox(height: 200),
          for (var i = 0; i < 10; i++) const TextField()
        ],
      ),
    ),
  ),
);

사용 사례에 따라 listview 사용을 고려할 수도 있습니다 . 그러면 공간이 충분하지 않을 때 내용이 스크롤됩니다. 예를 들어 갤러리 앱에서 텍스트 필드 데모를 볼 수 있습니다.

아래 항목 속성을 true에서 false로 변경하는 경우

<item name="android:windowFullscreen">false</item>

파일에

android/app/src/main/res/values/styles.xml

Flutter가 모든 페이지 콘텐츠를 입력 포커스에서 위쪽으로 드래그하도록했습니다.

나는 같은 문제에 직면하고 있었고 그것을 수정하기 위해 임의의 솔루션을 시도하기 시작했고 갑자기 이것이 해결되었습니다.

SingleChildScrollView () 내에서 기본 부모 컨테이너를 래핑하고 장치 높이 (예 : device_height = MediaQuery.of (context) .size.height)를 지정합니다.

이렇게하면 전체 페이지를 스크롤 할 수 있지만 위젯의 크기는 조정되지 않습니다.