修改首頁消息小黄条跑马灯滚动效果

lib/pages/home/single_day_page.dart

@@ -8,6 +8,7 @@ import 'package:flutter_app/utils/constant.dart';
 import 'package:flutter_app/utils/dio_utils.dart';
 import 'package:dio/dio.dart';
 import 'package:flutter_app/utils/utils.dart';
+import 'package:flutter_app/widgets/marquee_text.dart';
 import 'package:flutter_swiper/flutter_swiper.dart';
 
 class SingleDayPage extends StatefulWidget {
@@ -17,6 +18,7 @@ class SingleDayPage extends StatefulWidget {
 
 class PageState extends State<SingleDayPage> {
   HomeConfigEntity _homeConfigEntity;
+  bool _showNotificationLabel = false;
   String _weekDay = "周*";
   List<SyllabusItemEntity> _syllabusItemList = [
     SyllabusItemEntity(
@@ -50,6 +52,8 @@ class PageState extends State<SingleDayPage> {
         HomeConfigEntity.fromJson(jsonDecode(result.data));
     this.setState(() {
       _homeConfigEntity = homeConfigEntity;
+      _showNotificationLabel =
+          homeConfigEntity.notificationLabel.length > 2 ? true : false;
     });
   }
 
@@ -67,7 +71,7 @@ class PageState extends State<SingleDayPage> {
       body: Container(
         color: Colors.white,
         child: RefreshIndicator(
-            displacement: 30,
+            displacement: 20,
             child: ListView(
               children: <Widget>[
                 Container(
@@ -106,30 +110,53 @@ class PageState extends State<SingleDayPage> {
                     },
                   ),
                 ),
-                Container(
-                  height: 25,
-                  color: Color(0xffffebc7),
-                  child: Stack(
-                    children: <Widget>[
-                      Align(
-                        child: Text(
-                          _homeConfigEntity == null
-                              ? ""
-                              : _homeConfigEntity.notificationLabel,
-                          maxLines: 1,
-                          style:
-                              TextStyle(color: Color(0xff9fa0a0), fontSize: 12),
+                _showNotificationLabel == true
+                    ? Container(
+                        height: 25,
+                        color: Color(0xffffebc7),
+                        child: Stack(
+                          children: <Widget>[
+                            Padding(
+                                padding: EdgeInsets.only(left: 10, right: 26),
+                                child: Align(
+                                  child: MarqueeText(
+                                      child: Text(
+                                        _homeConfigEntity == null
+                                            ? ""
+                                            : _homeConfigEntity
+                                                .notificationLabel,
+                                        maxLines: 1,
+                                        style: TextStyle(
+                                            color: Color(0xff9fa0a0),
+                                            fontSize: 12),
+                                      ),
+                                      paddingLeft: 200,
+                                      duration: Duration(seconds: 5),
+                                      stepOffset: 230),
+                                  alignment: FractionalOffset(0.0, 0.5),
+                                )),
+                            Positioned(
+                              right: 5,
+                              child: GestureDetector(
+                                onTap: () {
+                                  this.setState(() {
+                                    _showNotificationLabel = false;
+                                  });
+                                },
+                                child: SizedBox(
+                                  width: 25,
+                                  height: 25,
+                                  child: Image.asset(
+                                    "lib/img/ic_del.png",
+                                    fit: BoxFit.cover,
+                                  ),
+                                ),
+                              ),
+                            )
+                          ],
                         ),
-                        alignment: FractionalOffset(0.0, 0.5),
-                      ),
-                      Positioned(
-                        right: 5,
-                        child:
-                            Icon(Icons.error_outline, color: Color(0xff9fa0a0)),
                       )
-                    ],
-                  ),
-                ),
+                    : Text(""),
                 Padding(
                   padding: EdgeInsets.only(top: 10, left: 15, bottom: 10),
                   child: Row(

lib/widgets/marquee_text.dart

@@ -0,0 +1,70 @@
+import 'dart:async';
+
+import 'package:flutter/material.dart';
+
+class MarqueeText extends StatefulWidget {
+  Widget child; // 轮播的内容
+  Duration duration; // 轮播时间
+  double stepOffset; // 偏移量
+  double paddingLeft; // 内容之间的间距
+
+  MarqueeText({this.child, this.paddingLeft, this.duration, this.stepOffset});
+
+  _MarqueeTextState createState() => _MarqueeTextState();
+}
+
+class _MarqueeTextState extends State<MarqueeText> {
+  ScrollController _controller; // 执行动画的controller
+  Timer _timer; // 定时器timer
+  double _offset = 0.0; // 执行动画的偏移量
+
+  @override
+  void initState() {
+    super.initState();
+
+    _controller = ScrollController(initialScrollOffset: _offset);
+    _timer = Timer.periodic(widget.duration, (timer) {
+      double newOffset = _controller.offset + widget.stepOffset;
+      if (newOffset != _offset) {
+        _offset = newOffset;
+        _controller.animateTo(_offset,
+            duration: widget.duration, curve: Curves.linear); // 线性曲线动画
+      }
+    });
+  }
+
+  @override
+  void dispose() {
+    _timer.cancel();
+    _controller.dispose();
+    super.dispose();
+  }
+
+  Widget _child() {
+    return new Row(children: _children());
+  }
+
+  // 子视图
+  List<Widget> _children() {
+    List<Widget> items = [];
+    for (var i = 0; i <= 2; i++) {
+      Container item = new Container(
+        margin: new EdgeInsets.only(right: i != 0 ? 0.0 : widget.paddingLeft),
+        child: i != 0 ? null : widget.child,
+      );
+      items.add(item);
+    }
+    return items;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return ListView.builder(
+      scrollDirection: Axis.horizontal, // 横向滚动
+      controller: _controller, // 滚动的controller
+      itemBuilder: (context, index) {
+        return _child();
+      },
+    );
+  }
+}

pubspec.yaml

@@ -83,6 +83,7 @@ flutter:
     - lib/img/ic_xuanke.png
     - lib/img/ic_xueji_guanli.png
     - lib/img/ic_school_card.png
+    - lib/img/ic_del.png
 
   # An image asset can refer to one or more resolution-specific "variants", see
   # https://flutter.dev/assets-and-images/#resolution-aware.