Issue
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Color(0xff003859),
appBar: AppBar(
title: Text(
"Conversor de moedas 360",
style: TextStyle(
color: Color(0xff003859)
)
),
backgroundColor: Color(0xffffa300),
),
body: FutureBuilder<Map>(
future: getData(),
builder: (context, snapshot) {
switch(snapshot.connectionState){
case ConnectionState.none:
case ConnectionState.waiting:
return Center(
child: Text(
"Carregando Dados...",
style: TextStyle(
color: Color(0xffffa300),
fontSize: 25.0
),
textAlign: TextAlign.center,
)
);
default:
if (snapshot.hasError){
return Center(
child: Text(
"Erro ao carregar dados...",
style: TextStyle(
color: Color(0xffffa300),
fontSize: 25.0
),
textAlign: TextAlign.center,
)
);
} else {
dolar = snapshot.data["results"]["currencies"]["USD"]["buy"];
euro = snapshot.data["results"]["currencies"]["EUR"]["buy"];
return Column(
children: <Widget>[
Image.asset(
"images/360Tecnologia.jpg",
fit: BoxFit.fitWidth,
),
SingleChildScrollView(
padding: EdgeInsets.all(10.0),
child: Column(
children: <Widget>[
TextField(
decoration: InputDecoration(
labelText: "Reais",
labelStyle: TextStyle(
color: Color(0xffffa300),
),
border: OutlineInputBorder(),
prefixText: "R\$ "
),
style: TextStyle(
color: Color(0xffffa300),
fontSize: 25.0
)
),
Divider(),
TextField(
decoration: InputDecoration(
labelText: "Dólares",
labelStyle: TextStyle(
color: Color(0xffffa300),
),
border: OutlineInputBorder(),
prefixText: "U\$ "
),
style: TextStyle(
color: Color(0xffffa300),
fontSize: 25.0
)
),
Divider(),
TextField(
decoration: InputDecoration(
labelText: "Euros",
labelStyle: TextStyle(
color: Color(0xffffa300),
),
border: OutlineInputBorder(),
prefixText: "€ "
),
style: TextStyle(
color: Color(0xffffa300),
fontSize: 25.0
)
),
Divider(),
TextField(
decoration: InputDecoration(
labelText: "Libra",
labelStyle: TextStyle(
color: Color(0xffffa300),
),
border: OutlineInputBorder(),
prefixText: "£\$ "
),
style: TextStyle(
color: Color(0xffffa300),
fontSize: 25.0
)
),
Divider(),
TextField(
decoration: InputDecoration(
labelText: "Bitcoin",
labelStyle: TextStyle(
color: Color(0xffffa300),
),
border: OutlineInputBorder(),
prefixText: "BTC "
),
style: TextStyle(
color: Color(0xffffa300),
fontSize: 25.0
)
),
Divider(),
TextField(
decoration: InputDecoration(
labelText: "Bitcoin",
labelStyle: TextStyle(
color: Color(0xffffa300),
),
border: OutlineInputBorder(),
prefixText: "BTC "
),
style: TextStyle(
color: Color(0xffffa300),
fontSize: 25.0
)
),
],
)
)
],
);
}
}
}
)
);
}
}
I want to show an image on top below the top bar. The image is fixed.
Below the top bar I have any text field inside the SingleChildScrollView widget, but this not work when I try to scroll the elements.
The text field can’t rolling when I roll the screen to up or to down.
The stackoverflow want I type more text because I put many code, but my doubt is explained on text up…
Any help?
Solution
Column(
children: <Widget>[
replace that with:
Stack(
children: <Widget>[
You are seeing that error because your SingleChildScrollView
is inside a Column
.
Another solution is to wrap your Parent Column
with SingleChildScrollView
instead of second one. But that will scroll your image too.
Or, if your image is a fixed one, you can add that to AppBar
bottom
:
AppBar(
//...
bottom: PreferredSize(
preferredSize: Size.fromHeight(129.0),
child: Image.asset(
"images/360Tecnologia.jpg",
fit: BoxFit.fitWidth,
),
),
),
Of course in this case if your snapshot.hasError
or when connection is waiting, you will see this image(You can have a condition like isDataAvailable
and make it true
when connection state done and check it in bottom
).
Another way is wrap parent Column
with another SingleChildScrollView
but that will make two scroll views. So to avoid image (Outher scroll view) to not to scroll add scrollPysics: NeverScrollPhysics()
(But I dont recommend unnecessary wrap with extra widget).
Answered By – Blasanka
Answer Checked By – Cary Denson (FlutterFixes Admin)