Flutter TextButton ElevatedButton වැනි විවිධ වර්ගයේ බොත්තම් සමඟ පැමිණේ. නමුත් බොහෝ බොත්තම් පෙළ පදනම් වේ. මෙම ලිපියෙන් අපි Flutter Icon බොත්තම ක්රියාත්මක කරන්නේ කෙසේදැයි බලමු. එය ෆ්ලටර් පුස්තකාලයේ බහුලව භාවිතා වන බොත්තම් වලින් එකකි. පළමුව, නමට අනුව, අයිකන බොත්තම යනු අයිකනයක් ඇති බොත්තම වන අතර එය තට්ටු කිරීමෙන් යමක් කරයි.
Constructor
IconButton
(
{
Key? key,
double? iconSize,
VisualDensity? visualDensity,
EdgeInsetsGeometry padding = const EdgeInsets.all(8.0),
AlignmentGeometry alignment = Alignment.center,
double? splashRadius,
Color? color,
Color? focusColor,
Color? hoverColor,
Color? highlightColor,
Color? splashColor,
Color? disabledColor,
required VoidCallback? onPressed,
MouseCursor? mouseCursor,
FocusNode? focusNode,
bool autofocus = false,
String? tooltip,
bool enableFeedback = true,
BoxConstraints? constraints,
required Widget icon
}
)
Properties
-
alignment: Defines how to place the button on the widget tree.
-
autofocus: True if other widgets are not in focus, instead this widget is.
-
color: Defines the color of the Icon inside the button.
-
constraints: Optional size constraints for the button.
-
disabledColor: The color to show when the widget is disabled.
-
enableFeedback: Whether detected gestures should provide acoustic and/or haptic feedback.
-
focusColor: The color of the button when it is in focus.
-
hashCode: The hash code for this object.
-
highlightColor: The secondary color (optional) of the button when it is pressed.
-
hoverColor: The Icon color while hovering over the Icon.
-
icon: The icon to display inside the button.
-
iconSize: Icon’s size Inside the button.
-
key: Controls how one widget replaces another widget in the tree.
-
mouseCursor: The type of cursor to show when it hovers over the widget.
-
onPressed: The action to perform when the button is pressed.
-
padding: The padding to provide to the Icon.
-
runtimeType: A representation of the runtime type of the object.
-
splashColor: The color of the ripple effect produced when the user presses the button.
-
splashRadius: The splash radius.
-
tooltip: Text to represent the action when the button is pressed.
-
visualDensity: Defines how compact the icon button’s layout will be.
Example Project
The main.dart file:
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root
// of your application
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Apps Lanka Dev',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: HomeScreen(),
);
}
}
class HomeScreen extends StatefulWidget {
Const HomeScreen({Key? key}) : super(key: key);
@override
State createState() => _HomeScreen State();
}
class _HomeScreen State extends State {
int count = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text(
"Apps Lanka Dev",
),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// Creating a icon button
IconButton(
iconSize: 100,
icon: const Icon(
Icons.add,
),
// the method which is called
// when button is pressed
onPressed: () {
setState(
() {
count++;
},
);
},
),
// SizedBox used as the separator
const SizedBox(
height: 40,
),
// Text widget used to display count
Text(
"$count",
style: TextStyle(fontSize: 50, color: Colors.blue),
),
],
)),
);
}
}
We are developing Mobile application and Web application for more details visit our web site www.appslanka.lk
0 Comments