How to add responsiveness to Tablets through Positioned and padding widget? - flutter

Question

I am trying to use MediaQuery within LayoutBuilder and for all Positioned - Material buttons I need to add different logic for tablets ,small phone and big phone and I want to add if and else statement for these through mediaQuery
this if statement is displaying a error when I put it under positioned.
#override
Widget build(BuildContext context) {
var deviceData = MediaQuery.of(context);
double _width = MediaQuery.of(context).size.width;
double _height = MediaQuery.of(context).size.height;
var screenSize = MediaQuery.of(context).size;
return LayoutBuilder(builder: (context, constraints) {
return OrientationBuilder(builder: (context, orientation) {
Size size = MediaQuery.of(context).size;
double width = size.width > size.height ? size.height : size.width;
if (MediaQuery.of(context).size.width > 600) {
isLargeScreen = true;
} else {
isLargeScreen = false;
}
SizeConfig().init(constraints, orientation);
Positioned (
// height: context.heightPct(.99),
// width: context.widthPct(.99),
// Container(
// alignment: Alignment(,-.3),
// child: FractionallySizedBox(
// widthFactor: 30,
if (isLargeScreen){
width: 213 * SizeConfig.imageSizeMultiplier,
height: 92 * SizeConfig.heightMultiplier,
}else{
height: 92 * SizeConfig.heightMultiplier,
width: 213 * SizeConfig.imageSizeMultiplier,
child: Opacity(
opacity: 0.9,
// left: width*0.5,
// top: 900,
// top: 100,
child: _visible
? MaterialButton(
// minWidth:screenSize.width*0.1,
// 0.1 = 10% of the screen , 0.5 = 50% of the screen
// ios sizes usually are 620...
// height: screenSize.height*0.1,
onPressed: () => changeTextArabic1(),
onLongPress: () =>
changeTextEnglish1(),
// shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(60.0)
// child: Text(labels[i]),
// ),
child: Ink(
child: Text(surah0),
// disabledTextColor: Colors.transparent,
// color: Colors.cyan[300],
// // color: Colors.purple[300],
// highlightColor: Colors.blue,
// // shape: new RoundedRectangleBorder(borderRadius: new BorderRadius.circular(60.0)
// // ),
// textColor: Colors.white,
// color: Colors.cyan[400],
padding: EdgeInsets.all(21.0),
// padding: EdgeInsets.only(
// left: 28,
// top: 25,
// right: 28,
// bottom: 25),
decoration: BoxDecoration(
gradient: LinearGradient(
colors: [
// all together looks COOL royal Blue:
Colors.red,
Colors.blue,
// Color(0xff374ABE),
// Color(0xff64B6FF),
// Color(0xff0E0077),
// Color(0xff1B00EE)
],
// begin: Alignment.centerLeft,
// end: Alignment.centerRight,
),
),
),
// color: Colors.blue[300],
// highlightColor: Colors.blue,
// ),
textColor: Colors.white,
)
: Container(),
// ),
// ):Container()
),
}),

Answer 1

You can use:
isLargeScreen
? Positioned()
: Positioned()
or:
Positioned(
height: isLargeScreen ? something : something,
width: isLargeScreen ? something : something
)