151 lines
3.7 KiB
Dart
151 lines
3.7 KiB
Dart
import 'package:flutter/cupertino.dart';
|
|
import 'package:flutter/material.dart';
|
|
import 'package:flutter/widgets.dart';
|
|
import 'package:flutter_screenutil/flutter_screenutil.dart';
|
|
import 'package:get/get.dart';
|
|
import 'package:star_lock/app_settings/app_colors.dart';
|
|
import 'package:star_lock/mine/valueAddedServices/cloudStorage/cloud_storage_logic.dart';
|
|
import 'package:star_lock/mine/valueAddedServices/cloudStorage/cloud_storage_state.dart';
|
|
import 'package:star_lock/tools/titleAppBar.dart';
|
|
|
|
class CloudStoragePage extends StatefulWidget {
|
|
const CloudStoragePage();
|
|
|
|
@override
|
|
State<CloudStoragePage> createState() => _CloudStoragePageState();
|
|
}
|
|
|
|
class _CloudStoragePageState extends State<CloudStoragePage> {
|
|
final CloudStorageLogic logic = Get.put(CloudStorageLogic());
|
|
final CloudStorageState state = Get.find<CloudStorageLogic>().state;
|
|
|
|
@override
|
|
Widget build(BuildContext context) {
|
|
return Scaffold(
|
|
appBar: TitleAppBar(
|
|
barTitle: '云存储购买'.tr,
|
|
haveBack: true,
|
|
iconColor: Colors.black,
|
|
titleColor: Colors.black,
|
|
backgroundColor: Colors.white,
|
|
),
|
|
body: SafeArea(
|
|
child: _buildBody(),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildBody() {
|
|
return Container(
|
|
decoration: const BoxDecoration(
|
|
gradient: LinearGradient(
|
|
begin: Alignment.topCenter,
|
|
end: Alignment.center,
|
|
colors: [Color(0xFFC5F0E7), Color(0xFFF7F7F7)],
|
|
),
|
|
),
|
|
child: Column(
|
|
children: [
|
|
// 购买套餐选项卡
|
|
_buildPurchasePackage()
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildPurchasePackage() {
|
|
return Container(
|
|
width: 1.sw,
|
|
margin: EdgeInsets.symmetric(
|
|
vertical: 12.h,
|
|
horizontal: 14.w,
|
|
),
|
|
decoration: BoxDecoration(
|
|
color: const Color(0xFFF7F7F7),
|
|
borderRadius: BorderRadiusDirectional.all(
|
|
Radius.circular(16.r),
|
|
),
|
|
),
|
|
child: Column(
|
|
children: [
|
|
_buildTabs(),
|
|
_buildTabContent(),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildTabs() {
|
|
return Obx(
|
|
() => Row(
|
|
crossAxisAlignment: CrossAxisAlignment.center,
|
|
children: List.generate(
|
|
state.tabs.length,
|
|
(int index) => _buildTabItem(index),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildTabItem(int index) {
|
|
return Expanded(
|
|
child: GestureDetector(
|
|
onTap: () {
|
|
state.selectedIndex.value = index;
|
|
},
|
|
child: Container(
|
|
height: 68.h,
|
|
decoration: BoxDecoration(
|
|
color: _isSelectTabBgColor(index),
|
|
borderRadius: BorderRadiusDirectional.only(
|
|
topStart: Radius.circular(16.r),
|
|
topEnd: Radius.circular(16.r),
|
|
),
|
|
),
|
|
child: Center(
|
|
child: Text(
|
|
state.tabs[index],
|
|
style: _isSelectTabTitle(index),
|
|
),
|
|
),
|
|
),
|
|
),
|
|
);
|
|
}
|
|
|
|
TextStyle _isSelectTabTitle(int index) {
|
|
if (state.selectedIndex.value == index) {
|
|
return TextStyle(
|
|
color: const Color(0xFF040404),
|
|
fontWeight: FontWeight.w600,
|
|
fontSize: 28.sp,
|
|
);
|
|
}
|
|
return TextStyle(
|
|
color: const Color(0xFF8F8F8F),
|
|
fontSize: 28.sp,
|
|
);
|
|
}
|
|
|
|
Color _isSelectTabBgColor(int index) {
|
|
if (state.selectedIndex.value == index) {
|
|
return Colors.white;
|
|
}
|
|
return const Color(0xFFF7F7F7);
|
|
}
|
|
|
|
Widget _buildTabContent() {
|
|
return Container(
|
|
width: 1.sw,
|
|
padding: EdgeInsets.symmetric(
|
|
vertical: 12.h,
|
|
horizontal: 14.w,
|
|
),
|
|
decoration: BoxDecoration(
|
|
color: Colors.white,
|
|
),
|
|
child: Text('asd'),
|
|
);
|
|
}
|
|
}
|