slide_digital_clock

KO | EN

gitlite — search

#python #ai #llm #android #machine-learning #deep-learning #docker #nodejs #windows #cli #vue #security #pytorch #open-source

slide_digital_clock

(★ 18)

✨A clean and lightweight Digital Clock Widget For Flutter

slide_digital_clock Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# 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: ](https://raw.githubusercontent.com/caglarylmz/slide_digital_clock/master/demo.gif)

## Pics

![Demo: ](https://raw.githubusercontent.com/caglarylmz/slide_digital_clock/master/example.png)

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

```

slide_digital_clock

slide_digital_clock Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

slide_digital_clock

slide_digital_clock Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README