Flutter Xlive Switch

Related tags

Templates dart flutter
Overview

xlive_switch

A Xlive Switcher plugin for Flutter

Getting Started

This plugin is based on Oleg Frolov's animation design which I found on Dribbble: https://dribbble.com/shots/5429846-Switcher-XLIV

Thanks Oleg Forlov for this beautiful design.

Design:

Demo:

Usage

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

You can change the color of the switch follow by these attributes:

  • activeColor: background color when value is true
  • unActiveColor: background color when value is false
  • thumbColor: your thumb color

Example

import 'package:flutter/material.dart';
import 'package:xlive_switch/xlive_switch.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool _value = true;

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Plugin example app'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              XlivSwitch(
                value: _value,
                onChanged: _changeValue,
              ),
              Text('Current value: $_value'),
            ],
          ),
        ),
      ),
    );
  }

  void _changeValue(bool value) {
    setState(() {
      _value = value;
    });
  }
}

You might also like...

Minha primeira aplicação android utilizando Flutter feito no curso de Flutter da Cod3r Cursos Online. O foco dessa aplicação foi um contato inicial com o Flutter.

Minha primeira aplicação android utilizando Flutter feito no curso de Flutter da Cod3r Cursos Online. O foco dessa aplicação foi um contato inicial com o Flutter.

expenses Expenses é uma aplicação android simples feita em Flutter para controlar despesas pessoais. A aplicação consiste em: Listar transações feitas

Apr 19, 2022

Flutter Github Following Application, Using Flutter Provider and Flutter HTTP to get data from Github API.

Flutter Github Following Application, Using Flutter Provider and Flutter HTTP to get data from Github API.

Flutter Github Following Application Watch it on Youtube Previous Designs Checkout my Youtube channel Installation Please remember, after cloning this

Dec 23, 2022

Flutter RSS feed parsing - A demo application of flutter which parse RSS XML contents to the flutter application

Flutter RSS feed parsing - A demo application of flutter which parse RSS XML contents to the flutter application

Flutter RSS feed parsing demo This is demo application of flutter which shows ho

Nov 15, 2022

Flutter mapbox - This Flutter plugin allows to show embedded interactive and customizable vector maps inside a Flutter widget

Flutter mapbox - This Flutter plugin allows to show embedded interactive and customizable vector maps inside a Flutter widget

Flutter Mapbox GL Please note that this project is community driven and is not a

Jan 31, 2022

Code for Flutter Talk from Flutter Vikings 2022: Custom User Interactions in Flutter

Code for Flutter Talk from Flutter Vikings 2022: Custom User Interactions in Flutter

Custom User Interactions - Flutter Vikings 2022 A companion app for the Flutter Vikings 2022 talk - Custom User Interactions with Shortcuts, Intents,

Sep 16, 2022

Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flutter app.

Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flutter app.

Flutter Tutorial - User Profile Page UI 1/2 Create a Flutter User Profile Page UI where you can access and edit your user's information within your Fl

Dec 6, 2022

Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flutter app.

Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flutter app.

Flutter Tutorial - User Profile Page UI #2 Create a Flutter User Profile Page UI where you can access and edit your user's information within your Flu

Dec 15, 2022

Let's create a selectable Flutter Navigation Drawer with routing that highlights the current item within the Flutter Sidebar Menu.

Let's create a selectable Flutter Navigation Drawer with routing that highlights the current item within the Flutter Sidebar Menu.

Flutter Tutorial - Sidebar Menu & Selectable Navigation Drawer Let's create a selectable Flutter Navigation Drawer with routing that highlights the cu

Dec 26, 2022

Components that optimize Flutter fluency.(Flutter 流畅度优化的通用方案,轻松解决卡顿问题)

Components that optimize Flutter fluency.(Flutter 流畅度优化的通用方案,轻松解决卡顿问题)

Flutter fluency optimization component "Keframe" Page switching fluency improved: How to use Project depend on: Quick learning Constructor Description

Dec 30, 2022
Owner
Châu Minh Phúc
I'm an Android and Flutter developer, currently working for Manabie Vietnam.
Châu Minh Phúc
A beautiful switch made with Flutter

Crazy Switch Getting Started This project is a starting point for a Flutter application. A few resources to get you started if this is your first Flut

Pedro Massango 50 Nov 20, 2022
An easy to implement custom switch created for Flutter.

flutter_switch An easy to implement custom switch created for Flutter. Give it a custom height and width, border for the switch and toggle, border rad

Nickr 66 Dec 6, 2022
Beautiful Custom Switch package created with Flutter

custom_switch Beautiful Custom Switch package created with Flutter. The source code is 100% Dart, and everything resides in the /lib folder. Show some

Mohak Gupta 55 Sep 6, 2022
Daynightswitch - A day night switch widget for Flutter.

DayNightSwitch A day night switch widget for Flutter. Installation Add to pubspec.yaml. dependencies: day_night_switch: Usage To use plugin, just i

Divyanshu Bhargava 103 Oct 25, 2022
Building a simple Flutter app * Switch Theme * for understanding the BLoC State Management including: Cubit Communications with StreamSubscription & Managing Route.

Building a simple Flutter app * Switch Theme * for understanding the BLoC State Management including: Cubit Communications with StreamSubscription & Managing Route.

TAD 1 Oct 3, 2022
An interesting and practical switch component.

FSwitch An interesting and practical switch component. Supports setting tips, slider decorations, shadows, and good interaction. Author:Newton(coorchi

Fliggy Mobile 81 Dec 13, 2022
Declaratively switch child widgets based on the current `Router` location.

Features Declaratively switch child widgets based on the current Router location. class SideBar extends StatelessWidget { Widget build(_){ re

gskinner team 7 Dec 12, 2022
A smart switch for you.

Features A smart switch for you.

Narendra Bhatt 2 Aug 26, 2022
🆙🚀 Flutter application upgrade/ Flutter App Upgrade /Flutter App Update/Flutter Update / download Plug-in

???? Flutter application upgrade/ Flutter App Upgrade /Flutter App Update/Flutter Update / download Plug-in (with notice bar progress), supports full upgrade, hot update and incremental upgrade

PengHui Li 344 Dec 30, 2022
ABC of Flutter widgets. Intended for super beginners at Flutter. Play with 35+ examples in DartPad directly and get familiar with various basic widgets in Flutter

Basic Widgets Examples This is aimed for complete beginners in Flutter, to get them acquainted with the various basic widgets in Flutter. Run this pro

Pooja Bhaumik 815 Jan 3, 2023