Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Feature Implimented] Toggles Page Implimented #236

Open
wants to merge 6 commits into
base: main
Choose a base branch
from
Open

[Feature Implimented] Toggles Page Implimented #236

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
908e4b2
bottom_Navbars added
Rhishikesh12 Jun 1, 2023
d57003a
tttttt "bottom_Navbars added"
Rhishikesh12 Jun 1, 2023
87fbfdf
Merge branch 'Clueless-Community:main' into main
Rhishikesh12 Jun 4, 2023
282223b
bot_nav err
Rhishikesh12 Jun 6, 2023
3158ec6
toggles_added
Rhishikesh12 Jun 6, 2023
91474d9
Merge branch 'main' into toggles
Rhishikesh12 Jun 12, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions lib/data/widget_category.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import 'package:flutter_component_ui/ui_components/steppers/steppers.dart';
import '../ui_components/bottom_navbars/bottom_navbars.dart';
import '../ui_components/radios/radios.dart';
import '../ui_components/sliders/sliders.dart';
import '../ui_components/toggles/toggles.dart';

final List<Map<String, dynamic>> widgetCategoryData = [
{
Expand All @@ -30,6 +31,10 @@ final List<Map<String, dynamic>> widgetCategoryData = [
'categoryName': 'Bottom Navigation Bars',
'categoryScreen': const BottomNavBarScreen(),
},
{
'categoryName': 'Toggle Buttons',
'categoryScreen': const ToggelButtonScreen(),
},
{
'categoryName': 'Avatars',
'categoryScreen': const AvatarScreen(),
Expand Down
78 changes: 69 additions & 9 deletions lib/ui_components/bottom_navbars/bottom_navbars.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -88,9 +88,30 @@ class BottomNavBarScreenState extends State<BottomNavBarScreen> {
),
GestureDetector(
onTap: () {
favProviderModel
.add(basicbottomNavbarIndex[index]);
setState(() {});
favProviderModel.add(
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 8,
),
constraints: const BoxConstraints(
minWidth:
400.0, // Set the minimum width constraint
maxWidth:
500.0, // Set the maximum width constraint
minHeight:
50.0, // Set the minimum height constraint
maxHeight:
100.0, // Set the maximum height constraint
),
child: basicbottomNavbar[index],
) as int,
);
setState(() {
basicbottomNavbarColor[index] =
Colors.amber;
});

},
child: Icon(
Icons.star_border_outlined,
Expand Down Expand Up @@ -153,9 +174,29 @@ class BottomNavBarScreenState extends State<BottomNavBarScreen> {
),
GestureDetector(
onTap: () {
favProviderModel
.add(animatedbottomNavbarIndex[index]);
setState(() {});
favProviderModel.add(
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 8,
),
constraints: const BoxConstraints(
minWidth:
400.0, // Set the minimum width constraint
maxWidth:
500.0, // Set the maximum width constraint
minHeight:
50.0, // Set the minimum height constraint
maxHeight:
100.0, // Set the maximum height constraint
),
child: animatedbottomNavbar[index],
) as int,
);
setState(() {
animatedbottomNavbarColor[index] =
Colors.amber;
});
},
child: Icon(
Icons.star_border_outlined,
Expand Down Expand Up @@ -218,9 +259,28 @@ class BottomNavBarScreenState extends State<BottomNavBarScreen> {
),
GestureDetector(
onTap: () {
favProviderModel
.add(fabbottomNavbarIndex[index]);
setState(() {});
favProviderModel.add(
Container(
padding: const EdgeInsets.symmetric(
horizontal: 12,
vertical: 8,
),
constraints: const BoxConstraints(
minWidth:
400.0, // Set the minimum width constraint
maxWidth:
500.0, // Set the maximum width constraint
minHeight:
50.0, // Set the minimum height constraint
maxHeight:
100.0, // Set the maximum height constraint
),
child: fabbottomNavbar[index],
) as int,
);
setState(() {
fabbottomNavbarColor[index] = Colors.amber;
});
},
child: Icon(
Icons.star_border_outlined,
Expand Down
64 changes: 64 additions & 0 deletions lib/ui_components/toggles/allToggels/Animated Toggles/animatedToggle1.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
import 'package:flutter/material.dart';

class CustomToggleButton3 extends StatefulWidget {
const CustomToggleButton3({Key? key}) : super(key: key);

@override
_CustomToggleButton3State createState() => _CustomToggleButton3State();
}

class _CustomToggleButton3State extends State<CustomToggleButton3> {
bool _isToggled = false;

@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
setState(() {
_isToggled = !_isToggled;
});
},
child: AnimatedContainer(
// margin: const EdgeInsets.only(left: 20, right: 20),
duration: const Duration(milliseconds: 200),
width: 80,
height: 40,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: _isToggled ? Colors.blue : Colors.grey,
),
child: Stack(
children: [
AnimatedAlign(
duration: const Duration(milliseconds: 300),
alignment:
_isToggled ? Alignment.centerRight : Alignment.centerLeft,
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Container(
width: 32,
height: 32,
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.white,
),
child: _isToggled
? const Icon(
Icons.light_mode,
color: Colors.blue,
size: 20,
)
: const Icon(
Icons.nightlight_round,
color: Colors.grey,
size: 20,
),
),
),
),
],
),
),
);
}
}
74 changes: 74 additions & 0 deletions lib/ui_components/toggles/allToggels/Animated Toggles/animatedToggle2.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,74 @@
import 'package:flutter/material.dart';

class CustomToggleButton2 extends StatefulWidget {
const CustomToggleButton2({Key? key}) : super(key: key);

@override
// ignore: library_private_types_in_public_api
_CustomToggleButton2State createState() => _CustomToggleButton2State();
}

class _CustomToggleButton2State extends State<CustomToggleButton2> {
bool _isToggled = false;

@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
setState(() {
_isToggled = !_isToggled;
});
},
child: AnimatedContainer(
// margin: const EdgeInsets.only(left: 20, right: 20),
duration: const Duration(milliseconds: 200),
width: 80,
height: 40,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: Colors.blue,
),
child: Stack(
children: [
const Align(
alignment: Alignment.centerLeft,
child: Padding(
padding: EdgeInsets.only(left: 8.0),
child: Icon(
Icons.light_mode_outlined,
color: Colors.white,
),
),
),
const Align(
alignment: Alignment.centerRight,
child: Padding(
padding: EdgeInsets.only(right: 8.0),
child: Icon(
Icons.nights_stay_rounded,
color: Colors.white,
),
),
),
AnimatedAlign(
duration: const Duration(milliseconds: 300),
alignment:
_isToggled ? Alignment.centerRight : Alignment.centerLeft,
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Container(
width: 32,
height: 32,
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.white,
),
),
),
),
],
),
),
);
}
}
56 changes: 56 additions & 0 deletions lib/ui_components/toggles/allToggels/Animated Toggles/disabledToggle.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
import 'package:flutter/material.dart';

class CustomToggleButton1 extends StatefulWidget {
const CustomToggleButton1({Key? key}) : super(key: key);

@override
_CustomToggleButton1State createState() => _CustomToggleButton1State();
}

class _CustomToggleButton1State extends State<CustomToggleButton1> {
bool _isToggled = false;

@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
setState(() {
_isToggled = !_isToggled;
});
},
child: IgnorePointer(
ignoring: true, // Disables user interaction
child: AnimatedContainer(
margin: const EdgeInsets.only(left: 140, right: 140),
duration: const Duration(milliseconds: 200),
width: 40,
height: 40,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: _isToggled ? Colors.blue : Colors.grey,
),
child: Stack(
children: [
AnimatedAlign(
duration: const Duration(milliseconds: 300),
alignment:
_isToggled ? Alignment.centerRight : Alignment.centerLeft,
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Container(
width: 32,
height: 32,
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.white,
),
),
),
),
],
),
),
),
);
}
}
53 changes: 53 additions & 0 deletions lib/ui_components/toggles/allToggels/Animated Toggles/modernToggle1.dart
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import 'package:flutter/material.dart';

class CustomToggleButton4 extends StatefulWidget {
const CustomToggleButton4({Key? key}) : super(key: key);

@override
_CustomToggleButton4State createState() => _CustomToggleButton4State();
}

class _CustomToggleButton4State extends State<CustomToggleButton4> {
bool _isToggled = false;

@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () {
setState(() {
_isToggled = !_isToggled;
});
},
child: AnimatedContainer(
margin: const EdgeInsets.only(left: 140, right: 140),
duration: const Duration(milliseconds: 200),
width: 40,
height: 40,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: _isToggled ? Colors.blue : Colors.grey,
),
child: Stack(
children: [
AnimatedAlign(
duration: const Duration(milliseconds: 300),
alignment:
_isToggled ? Alignment.centerRight : Alignment.centerLeft,
child: Padding(
padding: const EdgeInsets.all(4.0),
child: Container(
width: 32,
height: 32,
decoration: const BoxDecoration(
shape: BoxShape.circle,
color: Colors.white,
),
),
),
),
],
),
),
);
}
}
Loading