poem_detail.dart 5.43 KB
import 'dart:ui';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:one_poem/res/gaps.dart';
import 'package:one_poem/util/theme_utils.dart';
import 'package:one_poem/util/toast_utils.dart';
import 'package:one_poem/widgets/bars/home_action_bar.dart';
import 'package:one_poem/widgets/bars/home_title_bar.dart';
import 'package:one_poem/widgets/load_image.dart';
import 'package:one_poem/widgets/my_app_bar.dart';

class PoemDetailPage extends StatefulWidget {
  const PoemDetailPage({
    Key? key,
    this.onPop,
    required this.poemId,
  }) : super(key: key);

  final int poemId;
  final Function? onPop;

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

class _PoemDetailPageState extends State<PoemDetailPage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: MyAppBar(
        isTransparent: false,
        homeTitleHeader: HomeTitleHeader(
          funcLeft: () {
            print("lefltlelfle");
          },
        ),
        homeActionWidgets: HomeActionWidgets(
          funcStar: () {
            print("starrrrrrr");
          },
        ),
      ),
      body: Container(
        alignment: Alignment.topCenter,
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage("assets/images/poem/poem_background.png"),
            fit: BoxFit.fill,
          ),
        ),
        child: SafeArea(
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Container(
                margin: const EdgeInsets.symmetric(
                    vertical: 40.0, horizontal: 25.0),
                height: 240.0,
                width: double.infinity,
                decoration: BoxDecoration(
                  color: Colors.grey.shade200.withOpacity(0.1),
                  border: Border.all(color: Colors.grey, width: 0.1), // 边色与边宽度
                  borderRadius: BorderRadius.circular(2.0),
                ),
                child: ClipRect(
                  child: BackdropFilter(
                    filter: ImageFilter.blur(
                      sigmaX: 10.0,
                      sigmaY: 10.0,
                    ),
                    child: Container(
                      decoration: BoxDecoration(
                        color: Colors.grey.shade200.withOpacity(0.1),
                      ),
                      child: Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Column(
                          children: const [
                            Text(
                              "题破山寺后禅院",
                              style: TextStyle(
                                fontSize: 24.0,
                                color: Colors.white,
                              ),
                            ),
                            Gaps.vGap16,
                            Text(
                              "常建",
                              style: TextStyle(
                                fontSize: 18.0,
                                color: Colors.white,
                              ),
                            ),
                            Gaps.vGap12,
                            Text(
                              "清晨入古寺,初日照高林。\n竹径通幽处,禅房花木深。\n山光悦鸟性,潭影空人心。\n万籁此都寂,但余钟磬音。",
                              style: TextStyle(
                                  color: Colors.white,
                                  fontFamily: "ZCOOLXiaoWei",
                                  fontSize: 24.0),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ),
                ),
              ),
              const Padding(
                padding: EdgeInsets.symmetric(vertical: 10.0, horizontal: 25.0),
                child: Text(
                  "100位用户朗读录制提交了“临境”",
                  style: TextStyle(color: Colors.black, fontSize: 16.0),
                ),
              ),
              Container(
                padding: const EdgeInsets.symmetric(
                    vertical: 10.0, horizontal: 25.0),
                width: 400.0,
                height: 160.0,
                child: ListView.builder(
                    itemBuilder: (BuildContext context, int index) {
                  return Wrap(
                    spacing: 5.0,
                    crossAxisAlignment: WrapCrossAlignment.center,
                    children: const [
                      Icon(
                        Icons.play_circle_outline,
                        size: 16.0,
                      ),
                      Text(
                        "普通话",
                        style: TextStyle(color: Colors.white, fontSize: 16.0),
                      )
                    ],
                  );
                }),
              ),
              Row(
                children: [
                  IconButton(
                    icon: const Icon(Icons.mic_none),
                    onPressed: () {},
                  ),
                  IconButton(
                    icon: const Icon(Icons.camera_alt_outlined),
                    onPressed: () {},
                  )
                ],
              ),
            ],
          ),
        ),
      ),
    );
  }
}