Klavye göründüğünde, Flutter widget'ları yeniden boyutlandırılır. Bunu nasıl önleyebilirim?

Bunun gibi bir Genişletilmiş widget Sütunum var:

 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,
          ),
        ],
      ),
    );

Şöyle görünüyor:

convertFrom, bir TextField içerir. Bu metin alanına dokunduğumda ekranda Android klavye beliriyor. Bu, ekran boyutunu değiştirir, böylece widget'lar şu şekilde yeniden boyutlandırılır:

Sütunumun yeniden boyutlandırılmaması için klavyenin ekranı "kaplamasının" bir yolu var mı? ExpandedWidget kullanmazsam ve her widget için bir yüksekliği sabit kodlamazsam, widget'lar yeniden boyutlandırılmaz ancak klavye göründüğünde siyah ve sarı çizgili hata alıyorum (çünkü yeterli alan yok). Bu aynı zamanda tüm ekran boyutları için esnek değildir.

Bunun Android'e mi yoksa Flutter'a mı özgü olduğundan emin değilim.

Gözlerinde farklı Scaffold, set resizeToAvoidBottomInsetözelliği ile false.

"ResizeToAvoidBottomPadding" Mülkiyet .... artık önerilmemektedir sizin de Scaffoldset resizeToAvoidBottomPaddingmülk false.

Diğer cevapların çoğu kullanmanızı önerir resizeToAvoidBottomPadding=false. Deneyimlerime göre bu, klavyenin görüneceği yerin altındaysa klavyenin metin alanlarını örtmesine izin veriyor.

Mevcut çözümüm, SingleChildScrollViewsütunumu ekranla aynı yükseklikte olmaya zorlamak, ardından onu bir içine yerleştirmek, böylece Flutter, klavye kullanıldığında ekranımı otomatik olarak yeterince yukarı kaydırır.

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
            ],
          ),
        ),
      ),
    ),
  );
}

Kullandığım NeverScrollableScrollPhysicskullanıcı kendilerini etrafında kaydırma böylece.

Set resizeToAvoidBottomInsetiçin falseyerine resizeToAvoidBottomPaddinghangi kaldırılmıştır.

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

Yöntem 1:android:windowSoftInputMode="adjustResize" AndroidManifest.xml dosyasından kaldırın (Aksi takdirde flutter kodunu geçersiz kılar) ve resizeToAvoidBottomPadding: falseaşağıdaki gibi Scaffold'a ekleyin :

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

Yöntem 2 (Önerilmez):android:windowSoftInputMode="stateVisible" Aktivitede sadece android AndroidManifest.xml'de ekleyin , yalnızca Android için çalışacak ve IOS için Değil gibi çalışacaktır.

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

Not: Ayarlamayınandroid:windowSoftInputMode="adjustResize"

Eğer @ Aman'ın çözümünü uygularsak, uygulamamızın klavye göründüğünde çirkin davranmasına neden olacağını, ekran görünümümüzü mevcut yüksekliğe göre ayarlamayacağını ve diğer alanları klavyenin arkasına gizleyeceğini düşünüyorum. Bu yüzden SingleChildScrollViewbunun yerine kullanmanızı öneririm .

Kodunuzu SingleChildScrollViewaşağıda verilen şekilde sarın ,

 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,
      ),
    ],
  ),
 ),
);

Kullanım durumuna bağlı olarak bir liste görünümü kullanmayı da düşünebilirsiniz . Bu, yeterli yer olmadığında içeriğin kaydırılmasını sağlar. Örnek olarak, galeri uygulamasındaki metin alanı demosuna bakabilirsiniz.

Benim yaklaşımım fizik SingleChildScrollViewile kullanmaktır ClampingScrollPhysics.

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

Benim için aşağıdaki öğe özelliğini doğrudan yanlışa değiştiriyorum

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

dosyada

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

Flutter'ın tüm sayfa içeriğini giriş odağında yukarı doğru sürüklemesini sağladı

Benim önerim, resizeToAvoidBottomInset: falseklavye ekranda aniden belirirse, widget'ların yeniden boyutlandırılmasını önlemek için yine de kullanmaktır . Örneğin, bir kullanıcı uygulamanızda Facebook sohbet başlıklarını kullanıyorsa.

Klavyenin, ihtiyaç duyduğunuz ekranlarda widget'ları kaplamasını önlemek için, aşağıdaki yaklaşımı öneriyorum, burada SingleChildScrollViewyüksekliğin mevcut alanın yüksekliğine indirildiği yer. Bu durumda, SingleChildScrollViewodaklanan parçacığa da kaydırır.

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()
        ],
      ),
    ),
  ),
);