flutter pub add slide_digital_clock根據套件公開資料產生的選型評估，僅供參考。
一個優雅的數字時鐘小工具，適用於 Flutter，以流暢的滑動動畫顯示時間。設計簡約且可自訂，非常適合需要乾淨、現代化時間顯示的應用程式。時鐘即時更新，並支援多種格式選項。專為效能與簡潔性而打造，能無縫整合至任何 Flutter 專案中。特別適合儀表板、主畫面，或任何需要強調時間顯示的 UI 元素。
以下為關聯原始碼儲存庫的 README 原文快照，最新內容請造訪原始碼儲存庫。
To use plugin, just import package import 'package:slide_digital_clock/slide_digital_clock.dart';
is24HourTimeFormat : `true`
showSecondsDigit : `true`
areaAligment : `AlignmentDirectional.bottomCenter`
digitAnimationStyle : `Curves.decelerate`
hourMinuteDigitTextStyle : `Theme.of(context).textTheme.bodyText1`
secondDigitTextStyle : `Theme.of(context).textTheme.caption!.copyWith(fontSize: 10))`
amPmDigitTextStyle : `Theme.of(context).textTheme.caption!.copyWith(fontSize: 10, fontWeight: FontWeight.bold)`
import 'package:flutter/material.dart';
import 'package:slide_digital_clock/slide_digital_clock.dart';
void main() {
runApp(const ExampleApp());
}
class ExampleApp extends StatelessWidget {
const ExampleApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: "Slider Digital Clock Demo App",
home: Scaffold(
appBar: AppBar(
title: const Text("Slider Digital Clock Demo App"),
actions: [
DigitalClock(
hourMinuteDigitTextStyle: Theme.of(context)
.textTheme
.headline4!
.copyWith(color: Colors.white),
secondDigitTextStyle: Theme.of(context)
.textTheme
.caption!
.copyWith(color: Colors.white),
colon: Text(
":",
style: Theme.of(context)
.textTheme
.subtitle1!
.copyWith(color: Colors.white),
),
)
]),
body: Column(
children: [
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
const Text("Custom Colon"),
const SizedBox(width: 50),
DigitalClock(
hourMinuteDigitTextStyle: const TextStyle(fontSize: 18),
colon: const Icon(Icons.ac_unit, size: 12),
colonDecoration: BoxDecoration(
border: Border.all(), shape: BoxShape.circle),
)
],
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
const Text("Custom Styles"),
const SizedBox(width: 50),
DigitalClock(
hourDigitDecoration: BoxDecoration(
color: Colors.yellow,
border: Border.all(color: Colors.blue, width: 2)),
minuteDigitDecoration: BoxDecoration(
color: Colors.yellow,
border: Border.all(color: Colors.red, width: 2)),
secondDigitDecoration: BoxDecoration(
color: Colors.blueGrey,
border: Border.all(color: Colors.blue),
shape: BoxShape.circle),
secondDigitTextStyle: Theme.of(context)
.textTheme
.caption!
.copyWith(color: Colors.white),
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.start,
children: [
const Text("Show AM-PM, Disable Seconds"),
const SizedBox(width: 50),
DigitalClock(
is24HourTimeFormat: false,
showSecondsDigit: false,
),
],
)
],
),
),
);
}
}
暫無相關資料。