Question 78365 in Flutter Question posted in
The official Flutter documentation can be found here.

How can I use flutter_screenutil package for my hybrid app?

Here is how I have used flutter_screenutil in my project but getting error on when I tap on Textfield.
Kindly tell me how to use this package properly.

Note I want to use The second way of flutter_screenutil

My error:

No Overlay widget exists above EditableText-[LabeledGlobalKey#d3506](controller: TextEditingController#dc3bb(TextEditingValue(text: ┤ghf├, selection: TextSelection.collapsed(offset: 3, affinity: TextAffinity.downstream, isDirectional: false), composing: TextRange(start: 0, end: 3))), focusNode: FocusNode#482e2([PRIMARY FOCUS]), autocorrect: false, debugLabel: ((englishLike titleMedium 2014).merge(blackMountainView titleMedium)).merge(unknown), inherit: false, color: Color(0xff878787), family: EncodeSans_regular, familyFallback: [EncodeSans], size: 16.0, weight: 400, baseline: alphabetic, decoration: TextDecoration.none, textAlign: start, keyboardType: TextInputType(name: TextInputType.text, signed: null, decimal: null), autofillHints: [], dirty, dependencies: [Directionality, MediaQuery, ScrollConfiguration], state: EditableTextState#1d73f(tickers: tracking 1 ticker)). Usually the Navigator created by WidgetsApp provides the overlay. Perhaps your app content was created above the Navigator with the WidgetsApp builder parameter. ‘package:flutter/src/widgets/text_selection.dart’: Failed assertion: line 610 pos 7: ‘overlay != null’

main.dart

void main() async {
  await ScreenUtil.ensureScreenSize();
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      builder: (ctx, child) {
        ScreenUtil.init(ctx);
        return Theme(
            data: ThemeData(
              primarySwatch: Colors.blue,
            ),
            child: const HomeScreen());
      },
    );
  }
}

HomeScreen.dart

class HomeScreen extends StatefulWidget {
  const HomeScreen({Key? key}) : super(key: key);

  @override
  State<HomeScreen> createState() => _HomeScreenState();
}

class _HomeScreenState extends State<HomeScreen> {
  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(context, designSize: const Size(360, 739));
    TextEditingController searchController = TextEditingController();

    return SafeArea(
      child: Scaffold(
        body: Padding(
          padding: EdgeInsets.symmetric(
            horizontal: kPaddingHorizontal,

          ),
          child: Column(
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Text(
                        "Hello, Welcome",
                        style: kEncodeSansRegular.copyWith(color: kDarkBrown),
                      ),
                      SizedBox(height: 5.h),
                      Text(
                        "Hello, Welcome",
                        style: kEncodeSansBold.copyWith(color: kDarkBrown),
                      ),
                    ],
                  ),
                  CircleAvatar(
                    radius: 23.r,
                    backgroundImage: const AssetImage("assets/images/image5.png"),
                  ),
                ],
              ),
              SizedBox(height: 20.h),
              Row(children: [
                Expanded(
                  child: TextField(
                    style: kEncodeSansRegular.copyWith(color: kDarkGrey),
                    controller: searchController,
                    keyboardType: TextInputType.text,
                    autocorrect: false,
                    decoration: InputDecoration(
                      isDense: true,
                      contentPadding: EdgeInsets.symmetric(horizontal: 10.w),
                      prefixIcon: const Icon(
                        Icons.search,
                        color: kGrey,
                      ),
                      hintText: "Search Clothes...",
                      border: kInputBorder,
                      errorBorder: kInputBorder,
                      disabledBorder: kInputBorder,
                      focusedBorder: kInputBorder,
                      focusedErrorBorder: kInputBorder,
                      enabledBorder: kInputBorder,
                      hintStyle: kEncodeSansRegular.copyWith(color: kDarkGrey),
                    ),
                  ),
                ),
Tags:

2

Answers


  1. 0

    You can separate the MaterialApp on different context, for this you can do

    void main() async {
  await ScreenUtil.ensureScreenSize();
  runApp(const MaterialApp(home: MyApp()));
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    ScreenUtil.init(context);
    return Theme(
        data: ThemeData(
          primarySwatch: Colors.blue,
        ),
        child: const HomeScreen());
  }
}
    Login or Signup to reply.
  2. 0

    try this

    void main() async {
  await ScreenUtil.ensureScreenSize();
  runApp(const MaterialApp(home: MyApp()));
}


class MyApp extends StatelessWidget {
 String agent_id;
 MyApp(this.agent_id);
 @override
 Widget build(BuildContext context) {
 return ScreenUtilInit(
  designSize: MediaQuery.of(context).size.width<600?const Size(393, 872):const Size(1280, 844),

  minTextAdapt: true,
  splitScreenMode: true,
  builder: (BuildContext context, Widget? child) {
    return MaterialApp(
      title: 'test',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home:Catalogue(agent_id: agent_id),
      
    );
  },

);

 }
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search