huixiang_app/lib/setting/help_feedback_page.dart

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:huixiang/generated/l10n.dart';
import 'package:huixiang/view_widget/my_appbar.dart';
import 'package:huixiang/view_widget/round_button.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class HelpFeedbackPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _HelpFeedbackPage();
  }
}

class _HelpFeedbackPage extends State<HelpFeedbackPage> {
  var _isExpanded = [false, false, false];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: MyAppBar(
        title: S.of(context).bangzhuyufankui,
        titleColor: Colors.black,
        background: Color(0xFFF7F7F7),
        leadingColor: Colors.black,
      ),
      body: Container(
        decoration: new BoxDecoration(
          border: Border(
            bottom: BorderSide(
              color: Color(0xffF7F7F7),
            ),
          ),
          color: Color(0xffF7F7F7),
        ),
        child: Column(
          children: [
            Expanded(
              child: SingleChildScrollView(
                physics: BouncingScrollPhysics(),
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.start,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisSize: MainAxisSize.max,
                  children: [
                    SizedBox(
                      height: 24.h,
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 16.w),
                      child: Text(
                        S.of(context).fankui,
                        style: TextStyle(
                          fontWeight: FontWeight.bold,
                          color: Color(0xFF353535),
                          fontSize: 16.sp,
                        ),
                      ),
                    ),
                    _feedback(),
                    Container(
                      margin: EdgeInsets.only(left: 16.w),
                      child: Text(
                        S.of(context).lianxishoujihao,
                        style: TextStyle(
                          fontWeight: FontWeight.bold,
                          color: Color(0xFF353535),
                          fontSize: 16.sp,
                        ),
                      ),
                    ),
                    _contactPhoneNumber(),
                    Container(
                      margin: EdgeInsets.only(left: 16.w, bottom: 20.h),
                      child: Text(
                        S.of(context).changjianwenti,
                        style: TextStyle(
                          fontWeight: FontWeight.bold,
                          color: Color(0xFF353535),
                          fontSize: 16.sp,
                        ),
                      ),
                    ),
                    Container(
                      margin: EdgeInsets.symmetric(horizontal: 16.w),
                      padding: EdgeInsets.all(16.w),
                      decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.circular(8.w),
                        boxShadow: [
                          BoxShadow(
                            color: Colors.black.withAlpha(12),
                            offset: Offset(0, 3),
                            blurRadius: 14,
                            spreadRadius: 0,
                          )
                        ],
                      ),
                      child: Column(
                        children: [
                          _commonProblem('如何领取优惠券?',
                              "点击我的，进入我页面后，点击下方的领劵中心，进入后即可领取优惠券哦~", 0),
                          _commonProblem(
                              '如何兑换积分?',
                              "点击净弼，进入积分商城，点击你想兑换的领商品，进入商品详情后点击下方兑换，即可兑换哦~",
                              1),
                          _commonProblem(
                              '如何签到?',
                              "1.点击净弼，进入首页，点击上方的去签到。\n2.点击我的，进入我的页面，点击上方的积分详情，进入后即可签到。",
                              2),
                        ],
                      ),
                    ),
                    SizedBox(
                      height: 20.h,
                    ),
                  ],
                ),
              ),
              flex: 1,
            ),
            Container(
              height: 54.h,
              alignment: Alignment.center,
              color: Color(0xFF32A060),
              child: RoundButton(
                text: S.of(context).tijiao,
                backgroup: Color(0xFF32A060),
                textColor: Colors.white,
                fontSize: 16.sp,
                fontWeight: FontWeight.bold,
              ),
            ),
          ],
        ),
      ),
    );
  }

  _feedback() {
    return Container(
      width: double.infinity,
      height: 186.h,
      margin: EdgeInsets.all(16.w),
      decoration: new BoxDecoration(
        color: Color(0xffffffff),
        borderRadius: BorderRadius.circular(4.0),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(12),
            offset: Offset(0, 3),
            blurRadius: 14,
            spreadRadius: 0,
          ),
        ],
      ),
      child: Column(
        children: [
          Container(
            margin: EdgeInsets.fromLTRB(20.w, 5.h, 20.w, 0),
            alignment: Alignment.topLeft,
            child: TextField(
              maxLines: 5,
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: "您可以在这里输入反馈内容,例如产品建议，功能异常等",
                hintStyle: TextStyle(
                  fontSize: 14.sp,
                  color: Color(0xffA29E9E),
                ),
              ),
            ),
          ),
          Container(
            alignment: Alignment.bottomRight,
            padding: EdgeInsets.only(right: 20.w),
            child: Text(
              "0/50",
              style: TextStyle(
                fontSize: 14.sp,
                color: Color(0xffA29E9E),
              ),
            ),
          ),
        ],
      ),
    );
  }

  _contactPhoneNumber() {
    return Container(
      width: double.infinity,
      margin: EdgeInsets.all(16.w),
      decoration: new BoxDecoration(
        color: Color(0xffffffff),
        borderRadius: BorderRadius.circular(4.0),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withAlpha(12),
            offset: Offset(0, 3),
            blurRadius: 14,
            spreadRadius: 0,
          )
        ],
      ),
      child: Column(
        children: [
          Container(
            margin: EdgeInsets.fromLTRB(20.w, 0, 20.w, 0),
            alignment: Alignment.topLeft,
            child: TextField(
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: "请输入您的有效手机号",
                hintStyle: TextStyle(
                  fontSize: 14.sp,
                  color: Color(0xffA29E9E),
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }

  _commonProblem(var title, var cnt, var index) {
    return Container(
      alignment: Alignment.center,
      child: Column(
        children: <Widget>[
          ExpansionPanelList(
            elevation: 0,
            children: <ExpansionPanel>[
              ExpansionPanel(
                headerBuilder: (context, isExpanded) {
                  return ListTile(
                    title: Text(title),
                  );
                },
                body: Padding(
                  padding: EdgeInsets.fromLTRB(15.w, 0, 8.w, 8.h),
                  child: Text(
                    cnt,
                    style: TextStyle(
                      fontSize: 14.sp,
                      color: Color(0xff8B8B8B),
                    ),
                  ),
                ),
                isExpanded: _isExpanded[index],
                canTapOnHeader: true,
              ),
            ],
            expansionCallback: (panelIndex, isExpanded) {
              setState(() {
                _isExpanded[index] = !isExpanded;
              });
            },
            animationDuration: kThemeAnimationDuration,
          ),
        ],
      ),
    );
  }
}