【发布时间】：2022-01-19 08:06:05
【问题描述】：
我制作了两个页面并使用扩展的小部件..但在小屏幕上没有响应... 在我的应用程序中使用非常小的字体时可以...（我使用自动大小的文本但不行） 请观看我的代码并帮助我开发响应式应用程序 我也使用媒体查询，但不行
谢谢
const BottomContainerHeight = 80.0;
class InputPage extends StatefulWidget {
const InputPage({Key? key}) : super(key: key);
@override
_InputPageState createState() => _InputPageState();
}
enum Gender {
male,
female,
}
class _InputPageState extends State<InputPage> {
late Gender selectedGender = Gender.female;
int height = 180;
int weight = 70;
int age = 24;
@override
Widget build(BuildContext context) {
Size screenSize = MediaQuery.of(context).size;
Orientation orientation = MediaQuery.of(context).orientation;
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
title: const Text(
" bmiمحاسبه ",
style: TextStyle(color: Colors.white, fontSize: 25.0),
),
flexibleSpace: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
const Color(0xFF3366FF),
const Color(0xFF00CCFF),
],
begin: const FractionalOffset(0.0, 0.0),
end: const FractionalOffset(1.0, 0.0),
stops: [0.0, 1.0],
tileMode: TileMode.clamp),
),
),
centerTitle: true,
elevation: 3.0,
shadowColor: Colors.redAccent,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20.0),
bottomRight: Radius.circular(20.0))),
),
body: LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
return Container(
height: MediaQuery.of(context).size.height,
width: MediaQuery.of(context).size.width,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Expanded(
flex: 1,
child: Row(
children: [
Expanded(
child: SizedBox(
height: constraints.maxHeight * 0.5,
width: constraints.maxWidth * 0.5,
child: ReusableCard(
colour: selectedGender == Gender.female
? activeCardColoursFemale
: inactiveCardColoursFemale,
cardChild: IconContent(
height: constraints.maxHeight * 0.2,
width: constraints.maxWidth * 0.5,
svgPicture: 'assets/2.svg',
label: 'خانم',
),
onPress: () {
selectedGender = Gender.female;
},
),
),
),
Expanded(
child: SizedBox(
height: constraints.maxHeight * 0.9,
width: constraints.maxWidth * 0.5,
child: ReusableCard(
colour: selectedGender == Gender.male
? activeCardColoursMale
: inactiveCardColoursMale,
cardChild: IconContent(
height: constraints.maxHeight * 0.2,
width: constraints.maxWidth * 99,
svgPicture: 'assets/3.svg',
label: 'آقا',
),
onPress: () {
selectedGender = Gender.male;
},
),
),
),
],
)),
Expanded(
flex: 1,
child: ReusableCard(
onPress: () {},
colour: [Color(0xff5f72bd), Color(0xff9b23ea)],
//colour: Color(0xFF65E655),
cardChild: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
':میزان قد شما',
style: labelTextStyle,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.baseline,
textBaseline: TextBaseline.alphabetic,
children: [
Text(
'سانتیمتر',
style: labelTextStyle,
),
Text(
height.toString(),
style: numTextStyle,
)
],
),
SliderTheme(
data: SliderTheme.of(context).copyWith(
inactiveTrackColor: Colors.white,
activeTrackColor: Colors.amberAccent,
thumbColor: Colors.amber,
overlayColor: Color(0x1fFFF176),
thumbShape: RoundSliderThumbShape(
enabledThumbRadius: 15.0)
//shape ra bozorgtr mikonad...
,
overlayShape: RoundSliderOverlayShape(
overlayRadius: 30.0) //saye dor shape miandzad
),
child: Slider(
value: height.toDouble(),
min: 120.0,
max: 220.0,
onChanged: (double newValue) {
setState(() {
height = newValue.round();
});
},
),
),
],
),
),
),
Expanded(
flex: 1,
child: Row(
children: [
Expanded(
child: ReusableCard(
onPress: () {},
colour: [Colors.teal, Colors.tealAccent],
//colour: Color(0xFF65E655),
cardChild: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'وزن',
style: labelTextStyle,
),
Text(
weight.toString(),
style: numTextStyle,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
RoundIconButton(
icon: FontAwesomeIcons.minus,
color: Colors.greenAccent,
onPressed: () {
setState(() {
weight--;
});
}),
SizedBox(
width: 10.0,
),
RoundIconButton(
icon: FontAwesomeIcons.plus,
color: Colors.greenAccent,
onPressed: () {
setState(() {
weight++;
});
}),
],
)
],
),
),
),
Expanded(
flex: 1,
child: ReusableCard(
onPress: () {},
colour: [Color(0xfff9d423), Color(0xfff83600)],
//colour: Color(0xFF65E655),
cardChild: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'سن',
style: labelTextStyle,
),
Text(
age.toString(),
style: numTextStyle,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
RoundIconButton(
icon: FontAwesomeIcons.minus,
color: Colors.orange,
onPressed: () {
setState(() {
age--;
});
}),
SizedBox(
width: 10.0,
),
RoundIconButton(
icon: FontAwesomeIcons.plus,
color: Colors.orange,
onPressed: () {
setState(() {
age++;
});
}),
],
)
],
),
),
),
],
)),
BottomBotton(
onTap: () {
CalculatorBrain calc =
CalculatorBrain(height: height, weight: weight);
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => ResultPage(
bmiResult: calc.calculateBmi(),
resultText: calc.getResult(),
feedBack: calc.getFeedBack(),
)));
},
bottonTitle: 'محاسبه',
),
],
),
);
}));
}
}
请像我的主屏幕页面一样观看结果页面 谢谢你帮助我
class ResultPage extends StatelessWidget {
ResultPage({required this.bmiResult,
required this.resultText,
required this.feedBack});
final String bmiResult;
final String resultText;
final String feedBack;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.red,
flexibleSpace: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
const Color(0xFF3366FF),
const Color(0xFF00CCFF),
],
begin: const FractionalOffset(0.0, 0.0),
end: const FractionalOffset(1.0, 0.0),
stops: [0.0, 1.0],
tileMode: TileMode.clamp)),
),
title: Text(
' bmiمحاسبه ',
style: TextStyle(
fontFamily: 'assets/fonts/iraniansans', color: Colors.white),
),
),
body: SizedBox(
height: MediaQuery
.of(context)
.size
.height,
width: MediaQuery
.of(context)
.size
.width,
child: Column(
children: [
Expanded(
flex: 1,
child: Container(
alignment: Alignment.bottomCenter,
child: Text(
'نتیجه تست شما',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'assets/font/iraniansans',
fontSize: 35.0,
fontWeight: FontWeight.bold,
color: Colors.red),
),
),
),
Expanded(
flex: 5,
child: LayoutBuilder(
builder: (BuildContext context, BoxConstraints constraints) {
return Container(
margin: EdgeInsets.all(13.0),
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topRight,
end: Alignment.bottomLeft,
colors: [Color(0xfffff1eb), Color(0xfface0f9)],
),
borderRadius: BorderRadius.circular(10.0)),
child: Expanded(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Image.asset(
'assets/shakhes.png',
height: constraints.maxHeight * 0.5,
width: constraints.maxWidth * 99,
fit: BoxFit.fill,
),
SizedBox(
height: constraints.maxHeight * 0.4,
width: constraints.maxWidth * 0.9,
child: Column(
children: [Text(
resultText,
style: TextStyle(
fontFamily: 'assets/font/iraniansans',
fontSize: 30.0,
fontWeight: FontWeight.bold,
color: Colors.green),
),
Text(
bmiResult,
style: TextStyle(
fontFamily: 'assets/font/iraniansans',
fontSize: 30.0,
color: Colors.red),
),
Text(
feedBack,
style: TextStyle(
fontFamily: 'assets/font/iraniansans',
fontSize: 20.0,
color: Colors.black),
textDirection: TextDirection.rtl,
textAlign: TextAlign.center,
maxLines: 3,
),
],
),
),
],))
);
},
),
),
Expanded(
flex: 1,
child: BottomBotton(
bottonTitle: 'محاسبه دوباره',
onTap: () {
Navigator.pop(context);
}),
)
],
),
));
}
}
【问题讨论】：
标签： android ios flutter flutter-layout flutter-dependencies