嗨告诉我我怎样才能提高我的 FLutter 应用程序的性能这里是代码

问题描述 投票:0回答:0

第一次加载时,我在向下滚动时感觉滞后。但几秒钟后它运行起来就像一个魅力。

告诉我如何改进它

import 'package:flutter/material.dart';
import 'package:flutter_animate/flutter_animate.dart';

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

  @override
  _MytestingState createState() => _MytestingState();
}

class _MytestingState extends State<Mytesting> {
  // State properties and variables here...
  bool newNotifications = true;
  late ScrollController _scrollController;
  dynamic appbarText;
  dynamic drawerIcon;
  void toggleIcon() {
    setState(() {
      newNotifications = !newNotifications;
    });
  }

  @override
  void initState() {
    super.initState();
    // Initialization tasks, if any...
    _scrollController = ScrollController();
    _scrollController.addListener(_scrollListener);
  }

  _scrollListener() {
    // Check the scroll position

    double scrollOffset = _scrollController.offset;

    // Define the threshold point where you want to trigger an action
    double threshold = 325.0;

    // Perform your desired action when the scroll offset reaches the threshold
    if (scrollOffset >= threshold) {
      print(appbarText.runtimeType);
      // Scroll position has reached the desired point, do something
      // ...
      setState(() {
        appbarText = Animate(
          effects: const [FadeEffect(duration: Duration(milliseconds: 500))],
          child: const Text('Your Event Finder App',
              style: TextStyle(
                  color: Colors.white,
                  fontWeight: FontWeight.bold,
                  fontSize: 20)),
        );
        drawerIcon = Animate(
            effects: const [FadeEffect(duration: Duration(milliseconds: 500))],
            child: MaterialButton(
                shape: const CircleBorder(),
                child: const Icon(
                  Icons.menu,
                  color: Colors.white,
                ),
                onPressed: () {}));
      });
    } else {
      setState(() {
        appbarText = Container();
        drawerIcon = Container();
      });
    }
  }

  @override
  void dispose() {
    _scrollController.removeListener(_scrollListener);
    _scrollController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.deepPurple,
        body: CustomScrollView(
          controller: _scrollController,
          slivers: [
            SliverAppBar(
              leading: drawerIcon,
              title: appbarText,
              centerTitle: true,
              backgroundColor: const Color.fromARGB(255, 60, 31, 112),
              pinned: true,
              expandedHeight: 400, // Set the desired expanded height
              flexibleSpace: FlexibleSpaceBar(
                background: Container(
                  color: const Color.fromARGB(255, 60, 31, 112),
                  child: Stack(
                    children: [
                      // Your existing stack of widgets
                      // ...

                      Padding(
                          padding: const EdgeInsets.only(left: 180),
                          child: Animate(
                              effects: const [
                                SlideEffect(
                                    duration: Duration(milliseconds: 500))
                              ],
                              child: Image.asset(
                                'assets/images/EventsScreenRdesign.png',
                                alignment: Alignment.topRight,
                              ))),
                      Padding(
                        padding: const EdgeInsets.only(top: 64, left: 315),
                        child: InkWell(
                          borderRadius: BorderRadius.circular(50),
                          onTap: toggleIcon,
                          child: Icon(
                            Icons.notifications,
                            color: newNotifications ? Colors.red : Colors.white,
                            size: 25,
                          ),
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.only(left: 20, top: 55),
                        child: Container(
                          decoration: const BoxDecoration(
                              shape: BoxShape.circle, color: Colors.white),
                          width: 50,
                          height: 50,
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.only(left: 24, top: 140),
                        child: Animate(
                          effects: const [
                            FadeEffect(duration: Duration(milliseconds: 700)),
                            SlideEffect(duration: Duration(milliseconds: 400))
                          ],
                          child: const Text(
                            'Welcome Username',
                            style: TextStyle(
                              fontSize: 18,
                              color: Color.fromRGBO(173, 223, 238, 1),
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                        ),
                      ),
                      Padding(
                        padding: const EdgeInsets.only(left: 24, top: 170),
                        child: Animate(
                          effects: const [
                            FadeEffect(duration: Duration(milliseconds: 700)),
                            SlideEffect(duration: Duration(milliseconds: 400))
                          ],
                          child: const Text(
                            'Find Amazing Events Near You',
                            style: TextStyle(
                              fontSize: 28,
                              color: Colors.white,
                              fontWeight: FontWeight.bold,
                            ),
                          ),
                        ),
                      ),
                      const Padding(
                        padding: EdgeInsets.only(top: 260, left: 20),
                        child: Row(
                          children: [
                            Icon(
                              Icons.location_pin,
                              color: Color.fromRGBO(249, 194, 75, 1),
                            ),
                            Text(
                              '250 Events Around You',
                              style: TextStyle(color: Colors.white),
                            )
                          ],
                        ),
                      ),
                      const Padding(
                        padding: EdgeInsets.only(left: 30, top: 300, right: 30),
                        child: TextField(
                            decoration: InputDecoration(
                                enabledBorder: UnderlineInputBorder(
                                    borderSide: BorderSide(
                                        color: Color.fromRGBO(91, 57, 171, 1))),
                                suffixIcon: Icon(Icons.search,
                                    color: Color.fromRGBO(150, 121, 218, 1))),
                            style: TextStyle(
                              color: Colors.white,
                            )),
                      ),
                      Padding(
                        padding: const EdgeInsets.only(top: 370),
                        child: Row(
                          mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                          children: [
                            Container(
                              decoration: const BoxDecoration(
                                  shape: BoxShape.circle, color: Colors.white),
                              width: 50,
                              height: 50,
                            ),
                            Container(
                              decoration: const BoxDecoration(
                                  shape: BoxShape.circle, color: Colors.white),
                              width: 50,
                              height: 50,
                            ),
                            Container(
                              decoration: const BoxDecoration(
                                  shape: BoxShape.circle, color: Colors.white),
                              width: 50,
                              height: 50,
                            ),
                            Container(
                              decoration: const BoxDecoration(
                                  shape: BoxShape.circle, color: Colors.white),
                              width: 50,
                              height: 50,
                            )
                          ],
                        ),
                      )
                    ],
                  ),
                ),
              ),
            ),
            // Add other sliver widgets below if needed
            SliverToBoxAdapter(
              child: Padding(
                padding: const EdgeInsets.only(
                  top: 20.0,
                  left: 20,
                  right: 20,
                ),
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(10),
                  child: Container(
                    color: Colors.deepPurple[400],
                    height: 150,
                  ),
                ),
              ),
            ),
            SliverToBoxAdapter(
              child: Padding(
                padding: const EdgeInsets.only(
                  top: 20.0,
                  left: 20,
                  right: 20,
                ),
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(10),
                  child: Container(
                    color: Colors.deepPurple[400],
                    height: 150,
                  ),
                ),
              ),
            ),
            SliverToBoxAdapter(
              child: Padding(
                padding: const EdgeInsets.only(
                  top: 20.0,
                  left: 20,
                  right: 20,
                ),
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(10),
                  child: Container(
                    color: Colors.deepPurple[400],
                    height: 150,
                  ),
                ),
              ),
            ),
            SliverToBoxAdapter(
              child: Padding(
                padding: const EdgeInsets.only(
                  top: 20.0,
                  left: 20,
                  right: 20,
                ),
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(10),
                  child: Container(
                    color: Colors.deepPurple[400],
                    height: 150,
                  ),
                ),
              ),
            ),
            SliverToBoxAdapter(
              child: Padding(
                padding: const EdgeInsets.only(
                  top: 20.0,
                  left: 20,
                  right: 20,
                ),
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(10),
                  child: Container(
                    color: Colors.deepPurple[400],
                    height: 150,
                  ),
                ),
              ),
            ),
            SliverToBoxAdapter(
              child: Padding(
                padding: const EdgeInsets.only(
                  top: 20.0,
                  left: 20,
                  right: 20,
                ),
                child: ClipRRect(
                  borderRadius: BorderRadius.circular(10),
                  child: Container(
                    color: Colors.deepPurple[400],
                    height: 150,
                  ),
                ),
              ),
            ),
          ],
        ));
  }
}

第一次加载时,我在向下滚动时感觉滞后。但几秒钟后它运行起来就像一个魅力。

我希望它运行得非常流畅,就像在 120fps 的设备中一样,它应该以 120fps 的速度运行而没有任何延迟等。

android ios flutter hybrid-mobile-app mobile-application
© www.soinside.com 2019 - 2024. All rights reserved.