fix(ui): Change TextStyle to ResponsiveText

This commit is contained in:
anhtunz
2025-04-15 11:31:29 +07:00
parent da8eb3ae2d
commit 8310451f6b
19 changed files with 236 additions and 144 deletions

View File

@@ -25,8 +25,7 @@ addNewDevice(BuildContext context, String role) async {
children: [
Text(
'${appLocalization(context).add_device_title}: ',
style:
const TextStyle(fontSize: 18, fontWeight: FontWeight.bold),
style: context.responsiveBodyLargeWithBold,
),
Container(
alignment: Alignment.centerRight,

View File

@@ -46,8 +46,8 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
late DetailDeviceBloc detailDeviceBloc;
Completer<GoogleMapController> controller = Completer();
CameraPosition initialCamera =
const CameraPosition(target: LatLng(20.966048511844402, 105.74977710843086), zoom: 15);
CameraPosition initialCamera = const CameraPosition(
target: LatLng(20.966048511844402, 105.74977710843086), zoom: 15);
Timer? getDeviceDetailTimer;
@override
@@ -118,7 +118,8 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
children: [
Positioned.fill(
child: Image.asset(
ImageConstants.instance.getImage('smoke-detector'),
ImageConstants.instance
.getImage('smoke-detector'),
fit: BoxFit.fill,
),
),
@@ -156,13 +157,14 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
height: context.dynamicHeight(0.08),
width: context.dynamicWidth(0.5),
decoration: BoxDecoration(
color: DeviceUtils.instance
.getTableRowColor(context,deviceSnapshot.data?.state ?? 3),
color: DeviceUtils.instance.getTableRowColor(
context, deviceSnapshot.data?.state ?? 3),
borderRadius: BorderRadius.circular(50),
),
alignment: Alignment.bottomCenter,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
mainAxisAlignment:
MainAxisAlignment.spaceAround,
children: [
SizedBox(
height: context.mediumValue,
@@ -170,17 +172,20 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
child: deviceSnapshot.data?.state == 1
? RippleAnimation(
color: Colors.red,
delay: context.dynamicMilliSecondDuration(
delay: context
.dynamicMilliSecondDuration(
800,
),
repeat: true,
minRadius: 10,
ripplesCount: 5,
duration: context.dynamicMilliSecondDuration(
duration: context
.dynamicMilliSecondDuration(
1800,
),
child: CircleAvatar(
backgroundColor: Colors.transparent,
backgroundColor:
Colors.transparent,
minRadius: context.mediumValue,
maxRadius: context.mediumValue,
backgroundImage: AssetImage(
@@ -191,8 +196,10 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
),
)
: CircleAvatar(
backgroundColor:
DeviceUtils.instance.getTableRowColor(context,
backgroundColor: DeviceUtils
.instance
.getTableRowColor(
context,
deviceSnapshot.data?.state ?? 3,
),
minRadius: context.mediumValue,
@@ -237,19 +244,18 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
child: Padding(
padding: context.paddingLow,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
appLocalization(context)
.paginated_data_table_column_deviceSignal,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
),
),
appLocalization(context)
.paginated_data_table_column_deviceSignal,
style: context
.responsiveBodyLargeWithBold),
SizedBox(
height: context.dynamicWidth(0.12),
width: context.dynamicWidth(0.12),
@@ -259,7 +265,8 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
sensorSnapshot.data!['sensorCsq'],
),
size: 30,
color: DeviceUtils.instance.getSignalIconColor(
color: DeviceUtils.instance
.getSignalIconColor(
context,
sensorSnapshot.data!['sensorCsq'],
),
@@ -268,8 +275,10 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
],
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.start,
crossAxisAlignment:
CrossAxisAlignment.center,
children: <Widget>[
Container(
height: context.dynamicHeight(0.09),
@@ -277,9 +286,11 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
child: Text(
sensorSnapshot.data!['sensorCsq'],
style: TextStyle(
color: DeviceUtils.instance.getSignalIconColor(
color: DeviceUtils.instance
.getSignalIconColor(
context,
sensorSnapshot.data!['sensorCsq'],
sensorSnapshot
.data!['sensorCsq'],
),
fontSize: 40,
fontWeight: FontWeight.w900,
@@ -299,10 +310,12 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
child: Padding(
padding: context.paddingLow,
child: Column(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
appLocalization(context)
@@ -316,14 +329,18 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
height: context.dynamicWidth(0.12),
width: context.dynamicWidth(0.12),
child: Image.asset(
DeviceUtils.instance.getDeviceBatteryImg(
DeviceUtils.instance
.getDeviceBatteryImg(
int.parse(
sensorSnapshot.data!['sensorBattery'],
sensorSnapshot
.data!['sensorBattery'],
),
),
color: DeviceUtils.instance.getDeviceBatteryColor(
color: DeviceUtils.instance
.getDeviceBatteryColor(
int.parse(
sensorSnapshot.data!['sensorBattery'],
sensorSnapshot
.data!['sensorBattery'],
),
),
),
@@ -331,18 +348,23 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
],
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment:
MainAxisAlignment.start,
crossAxisAlignment:
CrossAxisAlignment.center,
children: <Widget>[
Container(
height: context.dynamicHeight(0.09),
alignment: Alignment.centerLeft,
child: Text(
sensorSnapshot.data!['sensorBattery'],
sensorSnapshot
.data!['sensorBattery'],
style: TextStyle(
color: DeviceUtils.instance.getDeviceBatteryColor(
color: DeviceUtils.instance
.getDeviceBatteryColor(
int.parse(
sensorSnapshot.data!['sensorBattery'],
sensorSnapshot
.data!['sensorBattery'],
),
),
fontSize: 50,
@@ -360,9 +382,11 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
child: Text(
'%',
style: TextStyle(
color: DeviceUtils.instance.getDeviceBatteryColor(
color: DeviceUtils.instance
.getDeviceBatteryColor(
int.parse(
sensorSnapshot.data!['sensorBattery'],
sensorSnapshot
.data!['sensorBattery'],
),
),
fontSize: 30,
@@ -390,7 +414,8 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
child: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
appLocalization(context)
@@ -405,9 +430,11 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
width: context.dynamicWidth(0.12),
child: Image.asset(
'assets/icons/temperature.png',
color: DeviceUtils.instance.getDeviceTempColor(
color: DeviceUtils.instance
.getDeviceTempColor(
int.parse(
sensorSnapshot.data!['sensorTemp'],
sensorSnapshot
.data!['sensorTemp'],
),
),
),
@@ -423,20 +450,28 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
width: double.infinity,
height: 20,
decoration: BoxDecoration(
color: Colors.grey.withValues(alpha: 0.3),
borderRadius: BorderRadius.circular(10),
color: Colors.grey
.withValues(alpha: 0.3),
borderRadius:
BorderRadius.circular(10),
),
),
LayoutBuilder(
builder: (context, constraints) => Container(
builder: (context, constraints) =>
Container(
width: constraints.maxWidth *
(int.parse(sensorSnapshot.data!['sensorTemp']) / 75),
(int.parse(sensorSnapshot
.data!['sensorTemp']) /
75),
height: 20,
decoration: BoxDecoration(
color: DeviceUtils.instance.getDeviceTempColor(
int.parse(sensorSnapshot.data!['sensorTemp']),
color: DeviceUtils.instance
.getDeviceTempColor(
int.parse(sensorSnapshot
.data!['sensorTemp']),
),
borderRadius: BorderRadius.circular(10),
borderRadius:
BorderRadius.circular(10),
),
),
)
@@ -446,25 +481,26 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
height: 5,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Text(
"${sensorSnapshot.data!['sensorTemp']} °C",
style: TextStyle(
color: DeviceUtils.instance.getDeviceTempColor(
color: DeviceUtils.instance
.getDeviceTempColor(
int.parse(
sensorSnapshot.data!['sensorTemp'],
sensorSnapshot
.data!['sensorTemp'],
),
),
fontSize: 30,
fontWeight: FontWeight.w900,
),
),
const Text(
Text(
"75 °C",
style: TextStyle(
fontSize: 20,
),
style: context.responsiveBodyLarge
),
],
)
@@ -480,11 +516,9 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
appLocalization(context).paginated_data_table_column_devicePower,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
),
appLocalization(context)
.paginated_data_table_column_devicePower,
style: context.responsiveBodyLargeWithBold
),
SizedBox(
height: context.dynamicWidth(0.12),
@@ -504,7 +538,8 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
stream: detailDeviceBloc.streamSensorTemps,
builder: (context, sensorTempsSnapshot) {
if (sensorTempsSnapshot.data == null) {
detailDeviceBloc.getNearerSensorValue(widget.thingID);
detailDeviceBloc
.getNearerSensorValue(widget.thingID);
return const AspectRatio(
aspectRatio: 3,
child: Center(
@@ -523,7 +558,8 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
child: Container(
margin: context.paddingLow,
child: sharedLineChart(
appLocalization(context).detail_device_volt_message,
appLocalization(context)
.detail_device_volt_message,
sensorTempsSnapshot.data ?? [],
),
),
@@ -550,33 +586,48 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
Radius.circular(15),
),
),
child: deviceSnapshot.data!.settings!.latitude != ""
child: deviceSnapshot
.data!.settings!.latitude !=
""
? StreamBuilder<String>(
stream: detailDeviceBloc.streamDeviceLocation,
stream: detailDeviceBloc
.streamDeviceLocation,
builder: (context, locationSnapshot) {
if (locationSnapshot.data == null) {
detailDeviceBloc.findLocation(
context, deviceSnapshot.data!.areaPath!);
context,
deviceSnapshot
.data!.areaPath!);
}
return GoogleMap(
initialCameraPosition: initialCamera,
initialCameraPosition:
initialCamera,
mapType: MapType.normal,
markers: {
Marker(
infoWindow: InfoWindow(
title: locationSnapshot.data ?? "",
title:
locationSnapshot.data ??
"",
),
markerId: MarkerId(deviceSnapshot.data!.thingId!),
markerId: MarkerId(
deviceSnapshot
.data!.thingId!),
position: LatLng(
double.parse(
deviceSnapshot.data!.settings!.latitude!),
double.parse(
deviceSnapshot.data!.settings!.longitude!),
double.parse(deviceSnapshot
.data!
.settings!
.latitude!),
double.parse(deviceSnapshot
.data!
.settings!
.longitude!),
),
),
},
onMapCreated: (mapcontroller) {
controller.complete(mapcontroller);
controller
.complete(mapcontroller);
},
mapToolbarEnabled: false,
zoomControlsEnabled: false,
@@ -591,11 +642,9 @@ class _DetailDeviceScreenState extends State<DetailDeviceScreen> {
),
),
Text(
appLocalization(context).device_update_location,
style: const TextStyle(
fontSize: 18,
fontWeight: FontWeight.bold,
),
appLocalization(context)
.device_update_location,
style: context.responsiveBodyLargeWithBold
)
],
),

View File

@@ -103,7 +103,7 @@ class _DevicesManagerScreenState extends State<DevicesManagerScreen> {
child: Text(
appLocalization(context)
.paginated_data_table_title,
style: context.headlineMediumTextStyle,
style: context.responsiveBodyLargeWithBold,
),
),
columns: [
@@ -190,10 +190,7 @@ class _DevicesManagerScreenState extends State<DevicesManagerScreen> {
SizedBox(height: context.lowValue),
Text(
appLocalization(context).overview_message,
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
style: context.responsiveBodyLargeWithBold
),
StreamBuilder<Map<String, List<Device>>>(
stream: devicesManagerBloc.streamDeviceByState,