lorsque je lance le projet pur flutter, lorsque le clavier est présenté, le champ de texte peut se déplacer au-dessus, et le widget peut très bien s'auto-adapter. mais lorsque j'ajoute un module de flutter au projet natif, le champ de texte du clavier corvers.
Je ne sais pas comment résoudre ce problème.
flutter:
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// setContentView(R.layout.activity_main);
//
// FrameLayout container = findViewById(R.id.container);
FlutterView flutterView = Flutter.createView(this, getLifecycle(), "route");
addContentView(flutterView, new FrameLayout.LayoutParams(FrameLayout.LayoutParams.MATCH_PARENT, FrameLayout.LayoutParams.MATCH_PARENT));
}
}
native:
class HomeWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'this is a project to test keyboard',
),
Flexible(
fit: FlexFit.tight,
child: CustomScrollView(
slivers: <Widget>[
SliverToBoxAdapter(
child: SizedBox(
width: 100,
height: 160,
child: Container(
color: Colors.blue,
),
),
),
SliverToBoxAdapter(
child: SizedBox(
width: 100,
height: 140,
child: Container(
color: Colors.grey,
),
),
),
SliverToBoxAdapter(
child: SizedBox(
width: 100,
height: 120,
child: Container(
color: Colors.red,
),
),
),
SliverToBoxAdapter(
child: SizedBox(
width: 100,
height: 100,
child: Container(
color: Colors.deepPurple,
),
),
),
SliverToBoxAdapter(
child: TextField(
decoration: InputDecoration(
hintText: 'this is first input text'
),
),
),
SliverToBoxAdapter(
child: Padding(padding: EdgeInsets.only(top: 20),),
),
SliverToBoxAdapter(
child: TextField(
decoration: InputDecoration(
hintText: 'this is second input text'
),
),
),
],
),
),
Container(
color: Colors.grey[400],
padding: EdgeInsets.all(8),
height: 50,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
FlatButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(2)
),
color: Colors.black,
textColor: Colors.white,
onPressed: () {
},
child: Text(
'button1'
)
),
FlatButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(2)
),
color: Colors.black,
textColor: Colors.white,
onPressed: () {
},
child: Text(
'button2'
)
),
FlatButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(2)
),
color: Colors.black,
textColor: Colors.white,
onPressed: () {
},
child: Text(
'button3'
)
)
],
),
)
],
);
}
}
c'est un pur projet de flutter: https://github.com/longdw/flutter_keyboard
ceci est un projet natif contient le module de flutter: https://github.com/longdw/keyboard_host
3 Réponses :
Vous pouvez envelopper votre corps dans SingleChildScrollView
https: // api.flutter.dev/flutter/widgets/SingleChildScrollView-class.html
J'ai fait un petit changement juste ajouté TextFiled à l'intérieur de Column. J'espère que tout va bien pour vous.
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'NonStopIO',
theme: new ThemeData(
primarySwatch: Colors.red,
),
home: new HomeWidget(),
);
}
}
class HomeWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method, and use it to set our appbar title.
title: Text("hello"),
),
body: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'this is a project to test keyboard',
),
Flexible(
fit: FlexFit.tight,
child: CustomScrollView(
slivers: <Widget>[
SliverToBoxAdapter(
child: SizedBox(
width: 100,
height: 160,
child: Container(
color: Colors.blue,
),
),
),
SliverToBoxAdapter(
child: SizedBox(
width: 100,
height: 140,
child: Container(
color: Colors.grey,
),
),
),
SliverToBoxAdapter(
child: SizedBox(
width: 100,
height: 120,
child: Container(
color: Colors.red,
),
),
),
SliverToBoxAdapter(
child: SizedBox(
width: 100,
height: 100,
child: Container(
color: Colors.deepPurple,
),
),
),
],
),
),
TextField(
decoration: InputDecoration(
hintText: 'this is first input text'
)
),
TextField(
decoration: InputDecoration(
hintText: 'this is lst input text'
)
),
Container(
color: Colors.grey[400],
padding: EdgeInsets.all(8),
height: 50,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: <Widget>[
FlatButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(2)
),
color: Colors.black,
textColor: Colors.white,
onPressed: () {
},
child: Text(
'button1'
)
),
FlatButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(2)
),
color: Colors.black,
textColor: Colors.white,
onPressed: () {
},
child: Text(
'button2'
)
),
FlatButton(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(2)
),
color: Colors.black,
textColor: Colors.white,
onPressed: () {
},
child: Text(
'button3'
)
)
],
),
),
],
)
);
}
}
je l'essaye, mais le problème demeure.
ajouter un projet de flutter pour exister projet Android natif le problème que je décris existe toujours.
Dans votre Scaffold, vous pouvez utiliser la propriété
resizeToAvoidBottomPadding: false,
Elle ne déplacera pas le contenu.
J'ai résolu en supprimant
<item name="android:windowFullscreen">true</item>
dans app/src/main/res/values/styles.xml
Je ne sais pas pourquoi il était là :)
ajoutez
android: windowSoftInputMode = "AdjustResize", c'est ok maintenant!