import 'package:flutter/material.dart';
import 'package:zhiying_comm/util/custom_sliver_persistent_header_delegate.dart';
import 'package:zhiying_comm/zhiying_comm.dart';

class BrandDetailTop extends StatefulWidget {
  @override
  _BrandDetailTopState createState() => _BrandDetailTopState();
}

class _BrandDetailTopState extends State<BrandDetailTop> {
  bool isOpen = false;

  @override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        Container(
          margin: EdgeInsets.only(left: 10, right: 10, top: 30),
          decoration: BoxDecoration(
              color: HexColor.fromHex("#FFFFFF"),
              borderRadius: BorderRadius.circular(8)),
          padding: EdgeInsets.only(top: 45, bottom: 12),
          width: double.infinity,
          child: Column(
            children: <Widget>[
              Text(
                "高露洁",
                style: TextStyle(
                    color: HexColor.fromHex("#FF1D1D1D"), fontSize: 15),
              ),
              SizedBox(
                height: 4,
              ),
              Container(
                decoration: BoxDecoration(
                    color: HexColor.fromHex("#FFFFECEC"),
                    borderRadius: BorderRadius.circular(40)),
                child: Padding(
                  padding: EdgeInsets.only(left: 4, right: 4),
                  child: Text(
                    "拥有百年历史的口腔护理专家",
                    style: TextStyle(
                        color: HexColor.fromHex("#FFFF4242"), fontSize: 10),
                  ),
                ),
              ),
              SizedBox(
                height: 14,
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  Text(
                    "粉丝：",
                    style: TextStyle(
                        color: HexColor.fromHex("#FF343434"), fontSize: 10),
                  ),
                  Text(
                    "888.8万",
                    style: TextStyle(
                        color: HexColor.fromHex("#FF343434"), fontSize: 10),
                  ),
                  SizedBox(
                    width: 11.5,
                  ),
                  Text(
                    "近期销量：",
                    style: TextStyle(
                        color: HexColor.fromHex("#FF343434"), fontSize: 10),
                  ),
                  Text(
                    "22.2万",
                    style: TextStyle(
                        color: HexColor.fromHex("#FF343434"), fontSize: 10),
                  ),
                ],
              ),
              SizedBox(
                height: 16,
              ),
              Text(
                "「个人护理用品已销售到全球200多个国家和地区」",
                style: TextStyle(
                    color: HexColor.fromHex("#FFFF4242"), fontSize: 11),
              ),
              SizedBox(
                height: 16,
              ),
              Container(
                height: isOpen ? null : 46,
                padding: EdgeInsets.all(4),
                child: Text(
                  "     高露洁公司已有200年的历史，产品已经销售到世界20多个国家和地区，成为全球领先的日用消费品公司，在口腔护理…个人护理、家居护理等方面为大众提供高品质的消费品，是广大消费者耳熟能详的全球著名品牌。",
                  overflow: TextOverflow.ellipsis,
                  maxLines: isOpen ? 1000 : 2,
                  style: TextStyle(
                      color: HexColor.fromHex("#FF767676"), fontSize: 12),
                ),
              ),
              GestureDetector(
                onTap: () {
                  ///点击展开更多
                  isOpen = !isOpen;
                  setState(() {});
                },
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    Text(
                      isOpen ? "收起" : "查看更多",
                      style: TextStyle(
                          color: HexColor.fromHex("#FF999999"), fontSize: 11),
                    ),
                    Icon(
                      isOpen ? Icons.keyboard_arrow_down : Icons.chevron_right,
                      size: 20,
                      color: HexColor.fromHex("#FF999999"),
                    )
                  ],
                ),
              )
            ],
          ),
        ),
        Align(
          alignment: Alignment.topCenter,
          child: Container(
            child: CachedNetworkImage(
              imageUrl: "",
              width: 67,
              height: 67,
              placeholder: (context, url) {
                return Container(
                  width: 67,
                  height: 67,
                  color: Colors.yellow,
                );
              },
            ),
          ),
        ),
      ],
    );
  }
}
