Commit f0d56772b1dada8b204a69f26763c6ccb1102b11

Authored by liangchengyou
1 parent d35a4e87

feat:更新尺寸适配

lib/app/app.dart
... ... @@ -2,6 +2,8 @@ import 'package:flutter/material.dart';
2 2 import 'package:flutter_bloc/flutter_bloc.dart';
3 3 import 'package:flutter_easyloading/flutter_easyloading.dart';
4 4 import 'package:flutter_screenutil/flutter_screenutil.dart';
  5 +import 'package:responsive_framework/breakpoint.dart';
  6 +import 'package:responsive_framework/responsive_breakpoints.dart';
5 7 import 'package:wow_english/common/widgets/hide_keyboard_widget.dart';
6 8 import 'package:wow_english/route/route.dart';
7 9 import 'package:wow_english/tab/blocs/tab_bloc.dart';
... ... @@ -25,7 +27,16 @@ class App extends StatelessWidget {
25 27 colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
26 28 useMaterial3: true,
27 29 ),
28   - builder: EasyLoading.init(),
  30 + builder: EasyLoading.init(
  31 + builder: (context,child) => ResponsiveBreakpoints(
  32 + breakpoints: const [
  33 + Breakpoint(start: 0, end: 450, name: MOBILE),
  34 + Breakpoint(start: 451, end: 800, name: TABLET),
  35 + Breakpoint(start: 801, end: 1920, name: DESKTOP),
  36 + Breakpoint(start: 1921, end: double.infinity, name: '4K'),
  37 + ],
  38 + child: child!)
  39 + ),
29 40 initialRoute: AppRouteName.splash,
30 41 navigatorKey: AppRouter.navigatorKey,
31 42 onGenerateRoute: AppRouter.generateRoute,
... ...
lib/common/widgets/textfield_customer_widget.dart
... ... @@ -59,14 +59,14 @@ class _TextFieldCustomerWidgetState extends State<TextFieldCustomerWidget> {
59 59 decoration: InputDecoration(
60 60 hintText: widget.hitText??'',
61 61 border: InputBorder.none,
62   - hintStyle: widget.hitStyle?? const TextStyle(
63   - fontSize: 16,
64   - color:Color(0xFF999999)
  62 + hintStyle: widget.hitStyle?? TextStyle(
  63 + fontSize: 16.sp,
  64 + color:const Color(0xFF999999)
65 65 )
66 66 ),
67   - style: widget.textStyle?? const TextStyle(
68   - color: Color(0xFF333333),
69   - fontSize: 16,
  67 + style: widget.textStyle?? TextStyle(
  68 + color: const Color(0xFF333333),
  69 + fontSize: 16.sp,
70 70 ),
71 71 onChanged: widget.onChangeValue,
72 72 ),
... ...
lib/common/widgets/we_app_bar.dart
1 1 import 'package:flutter/material.dart';
  2 +import 'package:flutter_screenutil/flutter_screenutil.dart';
2 3 import 'package:wow_english/common/extension/string_extension.dart';
3 4  
4 5 class WEAppBar extends StatelessWidget implements PreferredSizeWidget {
... ...
lib/home/home_page.dart
... ... @@ -31,7 +31,7 @@ class _HomePageView extends StatelessWidget {
31 31 } else if (type == HeaderActionType.listen) {
32 32 Navigator.of(AppRouter.context).pushNamed(AppRouteName.listen);
33 33 } else if (type == HeaderActionType.shop) {
34   -
  34 +
35 35 } else {
36 36  
37 37 }
... ...
lib/lessons/lesson_page.dart
... ... @@ -29,7 +29,7 @@ class LessonPage extends StatelessWidget {
29 29  
30 30 class _LessonPageView extends StatelessWidget {
31 31  
32   - final double _cardHeight = 240.0;
  32 + final double _cardHeight = 240.h;
33 33  
34 34 final double _numItemHeight = 32.0;
35 35  
... ... @@ -86,15 +86,15 @@ class _LessonPageView extends StatelessWidget {
86 86 ),
87 87 32.verticalSpace,
88 88 SizedBox(
89   - height: 32,
90   - width: 660,
  89 + height: 32.h,
  90 + width: 660.w,
91 91 child: ListView.builder(
92 92 itemCount: 10,
93 93 scrollDirection: Axis.horizontal,
94 94 itemBuilder: (BuildContext context,int index){
95 95 return Container(
96   - height: 32,
97   - width: 66,
  96 + height: 32.h,
  97 + width: 66.w,
98 98 padding: const EdgeInsets.symmetric(horizontal: 5),
99 99 child: GestureDetector(
100 100 onTap: () {
... ...
lib/listen/widgets/listen_item_widget.dart
... ... @@ -22,21 +22,21 @@ class ListenItemWidget extends StatelessWidget {
22 22 }
23 23 },
24 24 child: ClipRRect(
25   - borderRadius:BorderRadius.circular(90),
  25 + borderRadius:BorderRadius.circular(90.r),
26 26 child: Stack(
27 27 alignment:Alignment.center,
28 28 children: [
29 29 Image.network(
30 30 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fsafe-img.xhscdn.com%2Fbw1%2Faa1c2213-820a-4223-8757-5f8cee318a28%3FimageView2%2F2%2Fw%2F1080%2Fformat%2Fjpg&refer=http%3A%2F%2Fsafe-img.xhscdn.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1688713226&t=192b18a613683bcdc5bd76f65c9ff032',
31   - height: 180,
32   - width: 180,
  31 + height: 180.w,
  32 + width: 180.w,
33 33 fit: BoxFit.fill,
34 34 ),
35 35 Offstage(
36 36 offstage: isLock??false,
37 37 child: Container(
38   - height: 180,
39   - width: 180,
  38 + height: 180.w,
  39 + width: 180.w,
40 40 color: const Color.fromRGBO(1, 1, 0, 0.5),
41 41 ),
42 42 ),
... ... @@ -44,8 +44,8 @@ class ListenItemWidget extends StatelessWidget {
44 44 offstage: isLock,
45 45 child: Image.asset(
46 46 'listen_lock'.assetPng,
47   - height: 36,
48   - width: 41,
  47 + height: 36.h,
  48 + width: 41.w,
49 49 ),
50 50 )
51 51 ],
... ... @@ -55,7 +55,7 @@ class ListenItemWidget extends StatelessWidget {
55 55 23.verticalSpace,
56 56 Container(
57 57 height: 40.h,
58   - padding: const EdgeInsets.symmetric(horizontal: 22),
  58 + padding: EdgeInsets.symmetric(horizontal: 22.w),
59 59 decoration: BoxDecoration(
60 60 color: const Color(0xFFFFCC00),
61 61 borderRadius: BorderRadius.circular(20.r),
... ... @@ -68,7 +68,8 @@ class ListenItemWidget extends StatelessWidget {
68 68 child: Text(
69 69 'listen title',
70 70 style: TextStyle(
71   - fontSize: 15.sp
  71 + fontSize: 20.sp,
  72 + color: const Color(0xFF333333)
72 73 ),
73 74 ),
74 75 )
... ...
lib/login/forgetpwd/forget_password_home_page.dart
... ... @@ -54,11 +54,11 @@ class _ForgetPasswordHomePageView extends StatelessWidget {
54 54 width: 83.5.h,
55 55 ),
56 56 12.5.horizontalSpace,
57   - const Text(
  57 + Text(
58 58 '修改密码\n请输入您的手机号和验证码吧',
59 59 style: TextStyle(
60   - fontSize: 16.5,
61   - color: Color(0xFF666666)
  60 + fontSize: 16.sp,
  61 + color: const Color(0xFF666666)
62 62 ),
63 63 )
64 64 ],
... ... @@ -143,14 +143,15 @@ class _ForgetPasswordHomePageView extends StatelessWidget {
143 143 fit: BoxFit.fill
144 144 ),
145 145 ),
146   - padding: const EdgeInsets.symmetric(
147   - horizontal: 28.0,
148   - vertical: 14.0
  146 + padding: EdgeInsets.symmetric(
  147 + horizontal: 28.w,
  148 + vertical: 14.h
149 149 ),
150   - child:const Text(
  150 + child: Text(
151 151 '确定',
152 152 style: TextStyle(
153   - fontSize: 16
  153 + fontSize: 16.sp,
  154 + color: Colors.white
154 155 ),
155 156 ),
156 157 ),
... ...
lib/login/loginpage/login_page.dart
... ... @@ -59,9 +59,12 @@ class _LoginPageView extends StatelessWidget {
59 59 fit: BoxFit.fill
60 60 ),
61 61 ),
62   - padding: const EdgeInsets.symmetric(horizontal: 18.0),
  62 + padding: EdgeInsets.symmetric(horizontal: 18.w,vertical: 5.h),
63 63 child: Text(
64   - bloc.loginType == LoginType.sms?'密码登陆':'验证码密码'
  64 + bloc.loginType == LoginType.sms?'密码登陆':'验证码密码',
  65 + style: TextStyle(
  66 + fontSize: 16.sp
  67 + ),
65 68 ),
66 69 ),
67 70 )
... ... @@ -95,18 +98,18 @@ class _LoginPageView extends StatelessWidget {
95 98 RichText(
96 99 text: TextSpan(
97 100 children:[
98   - const TextSpan(
  101 + TextSpan(
99 102 text: '我已阅读并同意',
100 103 style: TextStyle(
101   - fontSize: 12,
102   - color: Color(0xFF333333),
  104 + fontSize: 12.sp,
  105 + color: const Color(0xFF333333),
103 106 )
104 107 ),
105 108 TextSpan(
106 109 text: '《用户隐私协议》',
107   - style: const TextStyle(
108   - fontSize: 12,
109   - color: Color(0xFF333333),
  110 + style: TextStyle(
  111 + fontSize: 12.sp,
  112 + color: const Color(0xFF333333),
110 113 ),
111 114 recognizer: TapGestureRecognizer()..onTap = (){
112 115 Navigator.of(context).pushNamed(
... ... @@ -116,18 +119,18 @@ class _LoginPageView extends StatelessWidget {
116 119 'webViewTitle':'用户隐私协议'
117 120 });
118 121 }),
119   - const TextSpan(
  122 + TextSpan(
120 123 text: ',',
121 124 style: TextStyle(
122   - fontSize: 12,
123   - color: Color(0xFF333333)
  125 + fontSize: 12.sp,
  126 + color: const Color(0xFF333333)
124 127 )
125 128 ),
126 129 TextSpan(
127 130 text: '《儿童隐私政策》',
128   - style: const TextStyle(
129   - fontSize: 12,
130   - color: Color(0xFF333333)
  131 + style: TextStyle(
  132 + fontSize: 12.sp,
  133 + color: const Color(0xFF333333)
131 134 ),
132 135 recognizer: TapGestureRecognizer()..onTap = (){
133 136 Navigator.of(context).pushNamed(
... ... @@ -157,12 +160,15 @@ class _LoginPageView extends StatelessWidget {
157 160 fit: BoxFit.fill
158 161 ),
159 162 ),
160   - padding: const EdgeInsets.symmetric(
161   - horizontal: 28.0,
162   - vertical: 14.0
  163 + padding: EdgeInsets.symmetric(
  164 + horizontal: 28.w,
  165 + vertical: 14.h
163 166 ),
164   - child: const Text(
165   - '登录'
  167 + child: Text(
  168 + '登录',
  169 + style: TextStyle(
  170 + fontSize: 16.sp
  171 + ),
166 172 ),
167 173 ),
168 174 )
... ... @@ -198,7 +204,11 @@ class _LoginPageView extends StatelessWidget {
198 204 controller: bloc.phoneNumController,
199 205 ),
200 206 6.5.verticalSpace,
201   - const Text('未注册用户登录默认注册'),
  207 + Text('未注册用户登录默认注册',
  208 + style: TextStyle(
  209 + fontSize: 12.sp,
  210 + color: const Color(0xFF999999)
  211 + ),),
202 212 4.5.verticalSpace,
203 213 Row(
204 214 mainAxisAlignment: MainAxisAlignment.spaceBetween,
... ... @@ -215,8 +225,7 @@ class _LoginPageView extends StatelessWidget {
215 225 controller: bloc.checkNumController,
216 226 )
217 227 ),
218   - TimerWidget(
219   - canSendSms: bloc.canSendSms)
  228 + TimerWidget(canSendSms: bloc.canSendSms)
220 229 ],
221 230 )
222 231 ],
... ... @@ -289,8 +298,11 @@ class _LoginPageView extends StatelessWidget {
289 298 width: 100.w,
290 299 height: 55.h,
291 300 alignment: Alignment.centerLeft,
292   - child: const Text(
293   - '忘记密码 ?'
  301 + child: Text(
  302 + '忘记密码 ?',
  303 + style: TextStyle(
  304 + fontSize: 12.sp
  305 + ),
294 306 ),
295 307 ),
296 308 )
... ...
lib/login/loginpage/time_widget.dart
1 1 import 'package:flutter/cupertino.dart';
2 2 import 'package:flutter/material.dart';
3 3 import 'package:flutter_bloc/flutter_bloc.dart';
  4 +import 'package:flutter_screenutil/flutter_screenutil.dart';
4 5 import 'package:wow_english/common/blocs/timerbloc/timer_bloc.dart';
5 6 import 'package:wow_english/common/extension/string_extension.dart';
6 7 import 'package:wow_english/common/widgets/timer_ticker.dart';
... ... @@ -43,9 +44,7 @@ class TimerWidgetView extends StatelessWidget {
43 44 final bloc = BlocProvider.of<TimerBloc>(context);
44 45 return GestureDetector(
45 46 onTap: () {
46   - print(bloc.isCountTimer);
47 47 if (canSendSms && !bloc.isCountTimer ) {
48   - print(state.duration);
49 48 bloc.add(StartEvent(duration: state.duration));
50 49 }
51 50 },
... ... @@ -58,13 +57,16 @@ class TimerWidgetView extends StatelessWidget {
58 57 fit: BoxFit.fill
59 58 ),
60 59 ),
61   - padding: const EdgeInsets.symmetric(horizontal:12.0,vertical: 15.0),
  60 + padding: EdgeInsets.symmetric(horizontal:12.w,vertical: 15.h),
62 61 child: Row(
63 62 children: [
64 63 if (state is RunningState)...[
65 64 const TimerText()
66 65 ] else ...[
67   - const Text('获取验证码')
  66 + Text('获取验证码',
  67 + style: TextStyle(
  68 + fontSize: 12.sp
  69 + ),)
68 70 ]
69 71 ],
70 72 ),
... ... @@ -83,6 +85,9 @@ class TimerText extends StatelessWidget {
83 85 final secondsStr = duration.toString().padLeft(2, '0');
84 86 return Text(
85 87 '${secondsStr}s后再次获取',
  88 + style: TextStyle(
  89 + fontSize: 12.sp
  90 + ),
86 91 );
87 92 }
88 93 }
... ...
lib/login/setpwd/set_pwd_page.dart
... ... @@ -55,11 +55,11 @@ class _SetPassWordPageView extends StatelessWidget {
55 55 width: 83.5.h,
56 56 ),
57 57 12.5.horizontalSpace,
58   - const Text(
  58 + Text(
59 59 '欢迎登录wow english\n接下来请设置一下您的密码吧!',
60 60 style: TextStyle(
61   - fontSize: 16.5,
62   - color: Color(0xFF666666)
  61 + fontSize: 16.5.sp,
  62 + color: const Color(0xFF666666)
63 63 ),
64 64 )
65 65 ],
... ... @@ -129,10 +129,11 @@ class _SetPassWordPageView extends StatelessWidget {
129 129 9.verticalSpace,
130 130 Offstage(
131 131 offstage: bloc.passwordCheck,
132   - child: const Text(
  132 + child: Text(
133 133 '请确认两次输入的密码是否一致',
134 134 style: TextStyle(
135   - color: Color(0xFF333333)
  135 + fontSize: 16.sp,
  136 + color: const Color(0xFF333333)
136 137 ),
137 138 ),
138 139 ),
... ... @@ -155,14 +156,15 @@ class _SetPassWordPageView extends StatelessWidget {
155 156 fit: BoxFit.fill
156 157 ),
157 158 ),
158   - padding: const EdgeInsets.symmetric(
159   - horizontal: 28.0,
160   - vertical: 14.0
  159 + padding: EdgeInsets.symmetric(
  160 + horizontal: 28.w,
  161 + vertical: 14.h
161 162 ),
162   - child: const Text(
  163 + child: Text(
163 164 '确定',
164 165 style: TextStyle(
165   - color: Colors.white
  166 + color: Colors.white,
  167 + fontSize: 16.sp
166 168 ),
167 169 ),
168 170 ),
... ...
pubspec.yaml
... ... @@ -85,6 +85,7 @@ dependencies:
85 85 limiting_direction_csx: ^0.2.0
86 86 # 富文本插件 https://pub.dev/packages/extended_text
87 87 extended_text: ^11.0.1
  88 + responsive_framework: ^1.0.0
88 89  
89 90 dev_dependencies:
90 91 build_runner: ^2.4.4
... ...