ar_tourism_flutter_unity/lib/pages/mine/account.dart

import 'package:flutter/material.dart';

import '../../components/appbar.dart';

class AccountPage extends StatefulWidget {
  const AccountPage({super.key});

  @override
  State<AccountPage> createState() => _AccountPageState();
}

class _AccountPageState extends State<AccountPage> {
  bool _obscurePassword = true;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomInset: false,
      appBar:  const CustomAppBar(title: '我的账户'),
      body: Container(
        decoration: const BoxDecoration(
          image: DecorationImage(
            image: AssetImage('images/pwd_bg.png'),
            fit: BoxFit.fill,
          ),
        ),
        child: Padding(
          padding: const EdgeInsets.all(20),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              // 第一行：头像和相机图标
              Center(
                child: Stack(
                  alignment: Alignment.bottomRight,
                  children: [
                    const CircleAvatar(
                      radius: 50,
                      backgroundImage:
                          AssetImage('images/logo.png'), // 替换为你的头像图片路径
                    ),
                    Positioned(
                      bottom: 5,
                      right: 5,
                      child: Container(
                        width: 24,
                        height: 24,
                        decoration: const BoxDecoration(
                          color: Color(0xff5BA5AF),
                          shape: BoxShape.circle,
                        ),
                        child: const Icon(
                          Icons.camera_alt,
                          size: 16,
                          color: Colors.white,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              const SizedBox(height: 20),

              const Text(
                '姓名',
                style: TextStyle(fontSize: 14, color: Colors.white),
              ),
              const SizedBox(height: 10),
              _buildTextField('姓名', '请输入姓名'),
              const SizedBox(height: 20),

              const Text(
                '邮箱',
                style: TextStyle(fontSize: 14, color: Colors.white),
              ),
              const SizedBox(height: 10),

              _buildTextField('邮箱', '请输入邮箱'),
              const SizedBox(height: 20),

              const Text(
                '手机号码',
                style: TextStyle(fontSize: 14, color: Colors.white),
              ),
              const SizedBox(height: 10),

              _buildTextField('手机号码', '请输入手机号码'),
              const SizedBox(height: 20),

              const Text(
                '密码',
                style: TextStyle(fontSize: 14, color: Colors.white),
              ),
              const SizedBox(height: 10),

              _buildPasswordTextField(),
              const SizedBox(height: 30),

              // 保存修改按钮
              buildLoginButton(context, '保存修改')
            ],
          ),
        ),
      ),
    );
  }

  // 构建通用输入框
  Widget _buildTextField(String label, String hintText) {
    return TextField(
       style: const TextStyle(color: Color.fromRGBO(255, 255, 255, 0.3)), // 设置输入的文字颜色
      decoration: InputDecoration(
        filled: true,
        fillColor: const Color(0xff1F212E),
        hintText: hintText,
         contentPadding: const EdgeInsets.symmetric(vertical: 12, horizontal: 16), // 控制高度和内边距
          border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(8),
          
        ),
        focusedBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(8),
          borderSide: BorderSide.none,
        ),
         enabledBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(8),
          borderSide: BorderSide.none,
        ),
      ),
    );
  }

  // 构建密码输入框带眼睛
  Widget _buildPasswordTextField() {
    return TextField(
      obscureText: _obscurePassword,
        style: const TextStyle(color: Color.fromRGBO(255, 255, 255, 0.3)), // 设置输入的文字颜色
      decoration: InputDecoration(
        filled: true,
        fillColor: const Color(0xff1F212E),
         contentPadding: const EdgeInsets.symmetric(vertical: 12, horizontal: 16), // 控制高度和内边距
        hintText: '请输入密码',
          border: OutlineInputBorder(
          borderRadius: BorderRadius.circular(8),
          
        ),
        focusedBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(8),
          borderSide: BorderSide.none,
        ),
         enabledBorder: OutlineInputBorder(
          borderRadius: BorderRadius.circular(8),
          borderSide: BorderSide.none,
        ),
        suffixIcon: IconButton(
          icon: Icon(
            _obscurePassword ? Icons.visibility_off : Icons.visibility,
          ),
          onPressed: () {
            setState(() {
              _obscurePassword = !_obscurePassword;
            });
          },
        ),
      ),
    );
  }

  Widget buildLoginButton(BuildContext context, String text) {
    return Align(
      child: Container(
        height: 45,
        width: 330,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(8),
          gradient: const LinearGradient(colors: [
            Color(0xff80DAA4),  
            Color(0xff79DDED),
          ]),
        ),
        child: ElevatedButton(
          style: ElevatedButton.styleFrom(
            backgroundColor: Colors.transparent,
            elevation: 0,
            shape: const RoundedRectangleBorder(
                borderRadius: BorderRadius.all(Radius.circular(8))),
            minimumSize: const Size(double.infinity, 50),
            padding: const EdgeInsets.symmetric(horizontal: 20),
          ),
          child: Text(text,
              style: const TextStyle(color: Colors.black, fontSize: 16)),
          onPressed: () {
            print("进入首页");
            // 主页面
            Navigator.pushReplacementNamed(context, '/tabs');
          },
        ),
      ),
    );
  }
}