Je crée l'écran de tutoriel dans lequel les deux vues comme: - une est doit être au centre de l'écran et une autre doit au bas de l'écran.
Mais mes deux affichages ne sont pas appropriés, veuillez vérifier les images ci-dessous.
J'ai fait certaines lignes du code pour le faire, mais ne pas obtenir la solution appropriée, veuillez vérifier ci-dessous le code une fois p> Vérifiez ci-dessus le code et laissez-moi savoir une fois. P>
3 Réponses :
Utilisez ceci pour obtenir la vue requise
Stack(children: <Widget>[ Align(alignment: Alignment.center, child: Container(width: 100, height: 100, color: Colors.redAccent,),), Align(alignment: Alignment.bottomCenter, child: Container(height: 100, color: Colors.purpleAccent,),) ],)
Merci pour la saisie, vous le fera savoir bientôt, pouvez-vous ajouter une explication à ce sujet.
mettre le conteneur bas code> intérieur
align code> widget et utilisez
alignement: alignement.bottomcenter code>.:
merci @zulfiqar strong> mais il n'est pas nécessaire de mettre la vue entière à l'intérieur de la pile code> pile code> Strong> et d'utiliser le widget Aligner code> strong> propriété avec elle.
Nous pouvons également utiliser le
CODE> FORT> ou
flexible code> strong> widget à sortir du problème.
Nous pouvons également utiliser le MediaQUERY CODE> FORT> pour celui-ci comme ci-dessous
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:page_indicator/page_indicator.dart';
class HomeScreen extends StatefulWidget {
@override
State<StatefulWidget> createState() {
// TODO: implement createState
return _HomeScreen();
}
}
class _HomeScreen extends State<HomeScreen> {
@override
void initState() {
// TODO: implement initState
super.initState();
}
@override
Widget build(BuildContext context) {
// TODO: implement build
return Material(
child:Align(
alignment: Alignment.center,
child:Column(
children: <Widget>[
Container(
height: MediaQuery.of(context).size.height*0.90, /////HERE I USED MEDIAQUERY FOR IT
child: PageIndicatorContainer(
child: PageView(
children: <Widget>[
Container(
color: Colors.red,
),
Container(
color: Colors.yellow,
),
Container(
color: Colors.blueAccent,
)
],
),
length: 3,
align: IndicatorAlign.bottom,
indicatorSpace: 5.0,
padding: EdgeInsets.all(10.0),
),
),
Container(
height: MediaQuery.of(context).size.height*0.10, ////HERE I USED MEDIAQUERY FOR IT
color: Colors.purple,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Container(
child: OutlineButton(
onPressed: () {
},
textColor: Colors.white,
child: Text(
"Login",
style: TextStyle(color: Colors.white),
),
),
),
Container(
margin: EdgeInsets.only(left: 10.0),
child: RaisedButton(
onPressed: () {},
color: Colors.black54,
child:
Text("SignUp", style: TextStyle(color: Colors.white)),
),
),
],
),
)
],
)
),
);
}
}
Vous voulez faire du widget rouge est au centre et au widget violet en bas? :'RÉ
@ Mohamedgaber couleur changera, je le crée pour la démo ou que vous pouvez dire pour un but d'apprentissage
vous voulez faire comme je le dis dans le premier commentaire ou autre chose parce que je veux poster une réponse dans votre question
Oui la même chose, je veux comme vous avez commenté en premier :)