Pakete, Repositories und App-Kategorien suchen

Cover von slide_digital_clock
Paketdetailsv1.0.3

slide_digital_clock

Digitale Uhr für Flutter

30-Tage-Downloads
720
Likes
58
Pub-Punkte
60

Paket installieren

flutter pub add slide_digital_clock

Paketübersicht

Aus öffentlichen Paketdaten erstellte Orientierung.

Ein schmaler Digitaluhr-Widget für Flutter, der die Zeit mit einer glatten Schiebeanimation anzeigt. Entwickelt für Minimalismus und Anpassbarkeit, ist er ideal für Apps, die eine saubere, moderne Zeitanzeige benötigen. Die Uhr aktualisiert sich in Echtzeit und unterstützt verschiedene Formatierungsoptionen. Mit Fokus auf Leistung und Einfachheit gebaut, integriert sie sich nahtlos in jedes Flutter-Projekt. Besonders gut geeignet für Dashboards, Startbildschirme oder beliebige UI-Elemente, bei denen die Sichtbarkeit der Zeit entscheidend ist.

Anwendungsfälle

  • Echtzeit-Uhrzeitanzeige in Apps
  • Dashboard-Widgets
  • Zuhause-Bildschirm-Uhren
  • Minimalistische UI-Designs
  • Digitale Uhren-Schnittstellen

Hauptmerkmale

  • Glatte Gleitzeitübergang
  • Anpassbarer Zeitformat
  • Leichtgewichtig und effizient
  • Einfache Integration mit Flutter
  • Unterstützt dunkle/helle Themen

Geeignet für

  • Einfache Zeitanzeigen
  • Flutter-Anfänger
  • Minimale App-Designs
  • Uhrbasierte Anwendungen
  • UI-Komponenten, die Echtzeit-Updates benötigen

Hinweise

  • Keine plattformspezifischen Funktionen
  • Eingeschränkte Anpassungsmöglichkeiten außerhalb des Zeitformats
  • Unterstützt keine Alarme oder Timer
  • Keine eingebaute Lokalisierung
  • Benötigt manuelle Thema-Handhabung

Original-README

Originaler README-Schnappschuss aus dem verknüpften Quell-Repository. Aktuelle Inhalte finden Sie im Repository.

Slide Digital Clock Plugin

Usage

To use plugin, just import package import 'package:slide_digital_clock/slide_digital_clock.dart';

Defaults

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)`

Demo

Demo:

Pics

Demo:

Example

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,
                ),
              ],
            )
          ],
        ),
      ),
    );
  }
}


Kategorien

Quell-Repository

Projekte, die dieses Paket verwenden

Noch keine Daten verfügbar.