Bläddra i källkod

发送给家长

xiong 3 år sedan
förälder
incheckning
bec9d9268f

BIN
example/assets/thinking_core/nav_back_black.png


+ 269 - 0
example/lib/four_page.dart

@@ -0,0 +1,269 @@
+import 'package:flutter/material.dart';
+import 'package:luojigou_thinking_core/src/view/ljg_defined_app_bar/ljg_defined_app_bar.dart';
+
+class FourPage extends StatefulWidget {
+  @override
+  FourPageState createState() => new FourPageState();
+}
+
+class FourPageState extends State<FourPage> {
+  List<CheckTestModel> _mdoelList;
+
+  @override
+  void initState() {
+    // TODO: implement initState
+    super.initState();
+    _mdoelList = List.generate(10, (index) {
+      return CheckTestModel(index % 2 == 0, "王小二" + index.toString());
+    }).toList();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      backgroundColor: Color(0xFFF5F6FA),
+      appBar: LJGDefinedAppBar(
+        navigationBarBackgroundColor: Colors.white,
+        title: '发送给家长',
+        trailingWidget: GestureDetector(
+          onTap: () {},
+          child: Container(
+            padding: EdgeInsets.symmetric(horizontal: 16),
+            alignment: Alignment.center,
+            color: Colors.transparent,
+            child: Text(
+              '确定',
+              style: TextStyle(fontSize: 14, height: 1, color: Color(0xFF5F87F0), fontWeight: FontWeight.w600),
+            ),
+          ),
+        ),
+      ),
+      body: Container(
+        // color: Color(0xFFF5F6FA),
+        margin: EdgeInsets.symmetric(horizontal: 16),
+        child: Column(
+          children: [
+            HeaderView(),
+            Expanded(
+                child: ListView.separated(
+                    padding: EdgeInsets.only(bottom: 15),
+                    itemBuilder: (_, index) {
+                      if (index == 0) {
+                        return FirstCell();
+                      } else if (index == _mdoelList.length - 1) {
+                        return LastCell();
+                      }
+                      return NormalCell(
+                        model: _mdoelList[index - 1],
+                      );
+                    },
+                    separatorBuilder: (_, index) {
+                      return DividingLinesView(index: index);
+                    },
+                    itemCount: _mdoelList.length + 2)),
+          ],
+        ),
+      ),
+    );
+  }
+}
+
+class HeaderView extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      margin: EdgeInsets.symmetric(vertical: 12),
+      padding: EdgeInsets.only(top: 20, bottom: 20, left: 12, right: 10),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.circular(10),
+      ),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          Text(
+            "全部家长",
+            style: TextStyle(color: Colors.black, fontSize: 16, height: 22 / 16, fontWeight: FontWeight.w500),
+          ),
+          CheckedIcon(WH: 23)
+        ],
+      ),
+    );
+  }
+}
+
+class FirstCell extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      padding: EdgeInsets.only(top: 25, bottom: 22, left: 12, right: 18),
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.only(topLeft: Radius.circular(10), topRight: Radius.circular(10)),
+      ),
+      child: Row(
+        mainAxisAlignment: MainAxisAlignment.spaceBetween,
+        children: [
+          Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Text(
+                "指定家长(93个家长)",
+                style: TextStyle(color: Colors.black, fontSize: 16, height: 22 / 16, fontWeight: FontWeight.w500),
+              ),
+              SizedBox(height: 4),
+              Text(
+                "选择家长分享评估报告",
+                style: TextStyle(color: Color(0xFF9C9AAB), fontSize: 12, height: 17 / 12, fontWeight: FontWeight.w400),
+              ),
+            ],
+          ),
+          Container(
+            width: 14,
+            height: 8,
+            child: CustomPaint(
+              painter: TrianglePainter(),
+            ),
+          )
+        ],
+      ),
+    );
+  }
+}
+
+class NormalCell extends StatelessWidget {
+  final CheckTestModel model;
+
+  const NormalCell({Key key, this.model}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      color: Colors.white,
+      // margin: EdgeInsets.symmetric(vertical: 12),
+      padding: EdgeInsets.only(left: 18, top: 21, bottom: 21),
+      child: Row(
+        children: [
+          model.state
+              ? CheckedIcon(WH: 18)
+              : UncheckedIcon(
+                  WH: 18,
+                ),
+          SizedBox(width: 15),
+          Text(
+            "王小二",
+            style: TextStyle(color: Colors.black, fontSize: 16, height: 22 / 16, fontWeight: FontWeight.w400),
+          ),
+        ],
+      ),
+    );
+  }
+}
+
+class LastCell extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      height: 49,
+      decoration: BoxDecoration(
+        color: Colors.white,
+        borderRadius: BorderRadius.only(bottomLeft: Radius.circular(10), bottomRight: Radius.circular(10)),
+      ),
+    );
+  }
+}
+
+class TrianglePainter extends CustomPainter {
+  @override
+  void paint(Canvas canvas, Size size) {
+    // TODO: implement paint
+    Paint paint = Paint()
+      ..color = Color(0xFFCACACA)
+      ..strokeWidth = 1.5
+      ..style = PaintingStyle.stroke;
+
+    Path path = Path();
+
+    path.moveTo(0, size.height);
+    path.lineTo(size.width / 2, 0);
+    path.lineTo(size.width, size.height);
+    // path.close();
+
+    canvas.drawPath(path, paint);
+  }
+
+  @override
+  bool shouldRepaint(covariant CustomPainter oldDelegate) {
+    // TODO: implement shouldRepaint
+    return true;
+  }
+}
+
+class DividingLinesView extends StatelessWidget {
+  final int index;
+
+  const DividingLinesView({Key key, this.index}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Row(
+      children: [
+        Container(
+          width: index == 0 ? 0 : 16,
+          height: 1,
+          color: Colors.white,
+        ),
+        Expanded(
+          child: Container(
+            height: 1,
+            color: Color(0xFFEEEEEE),
+          ),
+        ),
+      ],
+    );
+  }
+}
+
+//未选中Icon
+class UncheckedIcon extends StatelessWidget {
+  final double WH;
+
+  const UncheckedIcon({Key key, this.WH}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: WH,
+      height: WH,
+      decoration: BoxDecoration(borderRadius: BorderRadius.circular(WH / 2), border: Border.all(color: Color(0xFFD1D1D1), width: 1.3)),
+    );
+  }
+}
+
+//选中Icon
+class CheckedIcon extends StatelessWidget {
+  final double WH;
+
+  const CheckedIcon({Key key, this.WH}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      width: WH,
+      height: WH,
+      decoration: BoxDecoration(borderRadius: BorderRadius.circular(WH / 2), color: Color(0xFF5F87F0)),
+      child: Icon(
+        Icons.check_rounded,
+        color: Colors.white,
+        size: WH - 6,
+      ),
+    );
+  }
+}
+
+class CheckTestModel {
+  final bool state;
+  final String title;
+
+  CheckTestModel(this.state, this.title);
+}

+ 3 - 1
example/lib/main.dart

@@ -6,6 +6,8 @@ import 'package:luojigou_thinking_core/src/page/estimate/prepare_to_submit_recor
 import 'package:luojigou_thinking_core/src/page/competency_assessment_phase_page.dart';
 import 'package:luojigou_thinking_core/src/page/playroom/playroom_page.dart';
 
+import 'four_page.dart';
+
 void main() {
   runApp(const MyApp());
 }
@@ -23,7 +25,7 @@ class MyApp extends StatelessWidget {
       // home: Scaffold(
       //   body: Container(alignment:Alignment.bottomCenter,child: EvaluatingStudentSelect()),
       // ),
-      home: PlayroomPage(),
+      home: FourPage(),
     );
   }
 }

+ 69 - 0
lib/src/view/ljg_defined_app_bar/ljg_defined_app_bar.dart

@@ -0,0 +1,69 @@
+import 'package:flutter/material.dart';
+
+class LJGDefinedAppBar extends StatefulWidget implements PreferredSizeWidget {
+  final double contentHeight; //从外部指定高度
+  Color navigationBarBackgroundColor; //设置导航栏背景的颜色
+  Widget? leadingWidget;
+  Widget? trailingWidget;
+  String title;
+
+  LJGDefinedAppBar({
+    required this.title,
+    this.leadingWidget,
+    this.trailingWidget,
+    this.contentHeight = 44,
+    this.navigationBarBackgroundColor = Colors.white,
+  }) : super();
+
+  @override
+  State<StatefulWidget> createState() {
+    return _LJGDefinedAppBarState();
+  }
+
+  @override
+  Size get preferredSize => new Size.fromHeight(contentHeight);
+}
+
+class _LJGDefinedAppBarState extends State<LJGDefinedAppBar> {
+  @override
+  void initState() {
+    super.initState();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return new Container(
+      color: widget.navigationBarBackgroundColor,
+      child: new SafeArea(
+        top: true,
+        child: new Container(
+            decoration: new UnderlineTabIndicator(
+              borderSide: BorderSide(width: 1.0, color: Color(0xFFeeeeee)),
+            ),
+            height: widget.contentHeight,
+            child: new Stack(
+              alignment: Alignment.center,
+              children: <Widget>[
+                Positioned(
+                  left: 0,
+                  child: GestureDetector(
+                    onTap: () {
+                      Navigator.pop(context);
+                    },
+                    child: Container(
+                      color: Colors.transparent,
+                      padding: EdgeInsets.symmetric(horizontal: 15, vertical: 12),
+                      child: widget.leadingWidget ?? Image.asset("assets/thinking_core/nav_back_black.png", width: 13, height: 20),
+                    ),
+                  ),
+                ),
+                Container(
+                  child: Text(widget.title, style: TextStyle(fontSize: 16, height: 18 / 16, color: Color(0xFF161616), fontWeight: FontWeight.w600)),
+                ),
+                Positioned(right: 0, bottom: 0, top: 0, child: widget.trailingWidget!),
+              ],
+            )),
+      ),
+    );
+  }
+}