CATEGORIES
>>
Dart(2)
>>
Errors(5)
>>
Android(11)
>>
Errors(1)
>>
Errors(2)
>>
Windows 8(3)
>>
iPhone7(1)
>>
Errors(4)
>>
Html(1)
RECOMMENDED SITES
flutter selector - InkWell change background color when user pressed
Searhing keywords
- flutter button selector
- flutter inkwell selector
- flutter when pressed button change container background color
Solution
1- Widget should be StatefullWidget.
2- We are using InkWell onHighlightChanged method.
3- I create custom InkWell widget. Class name: cButtonIconable
CODE
Custom widget Using on SignInPage.dart
Screenshot Gif

- flutter button selector
- flutter inkwell selector
- flutter when pressed button change container background color
Solution
1- Widget should be StatefullWidget.
2- We are using InkWell onHighlightChanged method.
3- I create custom InkWell widget. Class name: cButtonIconable
CODE
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
class cButtonIconable extends StatefulWidget {
final Function onClick;
final String iconPath;
final String text;
final Color textColor;
final Color iconColor;
final Color bgColor;
final double fontSize;
final FontStyle fontStyle;
const cButtonIconable({
Key key,
this.onClick,
this.iconPath,
this.text,
this.textColor,
this.iconColor,
this.bgColor,
this.fontSize = 14,
this.fontStyle = FontStyle.normal
}) : super(key: key);
_cButtonIconableState createState() => _cButtonIconableState();
}
class _cButtonIconableState extends State<cButtonIconable>{
bool isPressed = false;
Widget build(BuildContext context) {
return InkWell(
highlightColor: Colors.transparent,
splashColor: Colors.transparent,
onHighlightChanged: (param){
setState((){
isPressed = param;
});
},
onTap: () {
widget.onClick();
},
child: Container(
margin: EdgeInsets.symmetric(vertical: 5),
padding: EdgeInsets.symmetric(horizontal: 10, vertical: 8),
decoration: BoxDecoration(
color: isPressed ? Colors.red : widget.bgColor,
borderRadius: BorderRadius.all(Radius.circular(10))),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
Image.asset(
widget.iconPath,
width: 20,
color: widget.iconColor != null ? widget.iconColor : null,
),
SizedBox(
width: 5,
),
Text(
widget.text,
style: TextStyle(color: widget.textColor != null ? widget.textColor : null, fontSize: widget.fontSize, fontStyle: widget.fontStyle),
)
],
)),
);
}
}
Custom widget Using on SignInPage.dart
cButtonIconable(
onClick: () async {
//Test();
// await LoginWithFacebook();
},
iconPath: ConstantsImagePath.facebook,
text: ResourceKey.loginWithFacebook,
textColor: ColorDark2,
iconColor: ColorFacebook,
bgColor: ColorPrimaryLight2,
fontSize: 15,
)
Screenshot Gif

Author: Engin ATALAY
Date: 31.01.2021 13:18:40
View Count: 8956
COMMENTS
No comments yet. Be the first to comment who you are.