Implementation in InWell on multiple widgets - flutter

Question

The flutter code below represents a list of MealsListView objects, which represents a series of buttons that are displayed to the user, what I want to do is add an onPressed method which, when the user clicks on the specific button, passes the button title to the _marcaturautente(titlename) function. How can I go about doing this?
Flutter dart code:
//Funzione che viene eseguita quando l'utente clicca su un pulsante per effettuare la marcatura
Future<void> _marcaturautente(String tipologiaMarcatura) async {
print("Sono dentro la funzione che esegue la marcatura");
//Instanzio l'oggetto che si occupa di recuperare i dati per la marcatura
var location = new Location();
//Recupero i valori per istanziare l'oggetto dell'utente
var email = await Storage.leggi("Email");
var password = await Storage.leggi("Password");
var idutente = int.parse(await Storage.leggi("IdUtente"));
location.onLocationChanged().listen((LocationData currentLocation) {
double longitudine = currentLocation.longitude;
double latitudine = currentLocation.latitude;
//Genero l'istanza dell'utente
var user = new Utente.init(idutente, email, password);
//Genero l'istanza che si occuperà di effettuare la marcatura
var marcatura = new Marcatura(user, longitudine, latitudine);
//Verifico la tipologia della marcatura
if (tipologiaMarcatura == "Ingresso") {
marcatura.ingresso();
} else if (tipologiaMarcatura == "Uscita") {
marcatura.uscita();
} else if (tipologiaMarcatura == "Arrivo") {
marcatura.arrivo();
} else if (tipologiaMarcatura == "Partenza") {
marcatura.partenza();
}
});
}
class MealsListView extends StatefulWidget {
const MealsListView(
{Key key, this.mainScreenAnimationController, this.mainScreenAnimation})
: super(key: key);
final AnimationController mainScreenAnimationController;
final Animation<dynamic> mainScreenAnimation;
#override
_MealsListViewState createState() => _MealsListViewState();
}
class _MealsListViewState extends State<MealsListView>
with TickerProviderStateMixin {
AnimationController animationController;
List<MealsListData> mealsListData = MealsListData.tabIconsList;
#override
void initState() {
animationController = AnimationController(
duration: const Duration(milliseconds: 2000), vsync: this);
super.initState();
}
Future<bool> getData() async {
await Future<dynamic>.delayed(const Duration(milliseconds: 50));
return true;
}
#override
void dispose() {
animationController.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: widget.mainScreenAnimationController,
builder: (BuildContext context, Widget child) {
return FadeTransition(
opacity: widget.mainScreenAnimation,
child: Transform(
transform: Matrix4.translationValues(
0.0, 30 * (1.0 - widget.mainScreenAnimation.value), 0.0),
child: Container(
height: 216,
width: double.infinity,
child: ListView.builder(
padding: const EdgeInsets.only(
top: 0, bottom: 0, right: 16, left: 16),
itemCount: mealsListData.length,
scrollDirection: Axis.horizontal,
itemBuilder: (BuildContext context, int index) {
final int count =
mealsListData.length > 10 ? 10 : mealsListData.length;
final Animation<double> animation =
Tween<double>(begin: 0.0, end: 1.0).animate(
CurvedAnimation(
parent: animationController,
curve: Interval((1 / count) * index, 1.0,
curve: Curves.fastOutSlowIn)));
animationController.forward();
return MealsView(
onTap: (index) {},
mealsListData: mealsListData[index],
animation: animation,
animationController: animationController,
tipologiaMarcatura: mealsListData[index].titleTxt);
},
),
),
),
);
},
);
}
}
typedef CustomCallback = void Function(int);
class MealsView extends StatelessWidget {
const MealsView(
{Key key,
this.mealsListData,
this.animationController,
this.animation,
this.index,
this.onTap,
this.tipologiaMarcatura})
: super(key: key);
//Stringa che viene inizializzata con la tipologia della marcatura
final String tipologiaMarcatura;
final MealsListData mealsListData;
final AnimationController animationController;
final Animation<dynamic> animation;
final int index;
final CustomCallback onTap;
//Recupero dei dati che vanno inseriti all'interno dell widget
Widget getData() {
return FadeTransition(
opacity: animation,
//wrap your Stack widget inside InkWell
child: Transform(
transform:
Matrix4.translationValues(100 * (1.0 - animation.value), 0.0, 0.0),
child: SizedBox(
width: 130,
child: Stack(
children: <Widget>[
Padding(
padding: const EdgeInsets.only(
top: 32, left: 8, right: 8, bottom: 16),
child: Container(
decoration: BoxDecoration(
boxShadow: <BoxShadow>[
BoxShadow(
color:
HexColor(mealsListData.endColor).withOpacity(0.6),
offset: const Offset(1.1, 4.0),
blurRadius: 8.0),
],
gradient: LinearGradient(
colors: <HexColor>[
HexColor(mealsListData.startColor),
HexColor(mealsListData.endColor),
],
begin: Alignment.topLeft,
end: Alignment.bottomRight,
),
borderRadius: const BorderRadius.only(
bottomRight: Radius.circular(8.0),
bottomLeft: Radius.circular(8.0),
topLeft: Radius.circular(8.0),
topRight: Radius.circular(54.0),
),
),
child: Padding(
padding: const EdgeInsets.only(
top: 54, left: 16, right: 16, bottom: 8),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
mealsListData.titleTxt,
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: TemaApp.fontName,
fontWeight: FontWeight.bold,
fontSize: 16,
letterSpacing: 0.2,
color: TemaApp.white,
),
),
Expanded(
child: Padding(
padding: const EdgeInsets.only(top: 8, bottom: 8),
child: Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Text(
mealsListData.meals.join('\n'),
style: TextStyle(
fontFamily: TemaApp.fontName,
fontWeight: FontWeight.w500,
fontSize: 10,
letterSpacing: 0.2,
color: TemaApp.white,
),
),
],
),
),
),
mealsListData.kacl != 0
? Row(
mainAxisAlignment: MainAxisAlignment.start,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
Text(
mealsListData.kacl.toString(),
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: TemaApp.fontName,
fontWeight: FontWeight.w500,
fontSize: 24,
letterSpacing: 0.2,
color: TemaApp.white,
),
),
Padding(
padding: const EdgeInsets.only(
left: 4, bottom: 3),
child: Text(
'',
style: TextStyle(
fontFamily: TemaApp.fontName,
fontWeight: FontWeight.w500,
fontSize: 10,
letterSpacing: 0.2,
color: TemaApp.white,
),
),
),
],
)
: Container(
decoration: BoxDecoration(
color: TemaApp.nearlyWhite,
shape: BoxShape.circle,
boxShadow: <BoxShadow>[
BoxShadow(
color: TemaApp.nearlyBlack
.withOpacity(0.4),
offset: Offset(8.0, 8.0),
blurRadius: 8.0),
],
),
child: Padding(
padding: const EdgeInsets.all(6.0),
child: Icon(
Icons.add,
color: HexColor(mealsListData.endColor),
size: 24,
),
),
),
],
),
),
),
),
Positioned(
top: 0,
left: 0,
child: Container(
width: 84,
height: 84,
decoration: BoxDecoration(
color: TemaApp.nearlyWhite.withOpacity(0.2),
shape: BoxShape.circle,
),
),
),
Positioned(
top: 0,
left: 8,
child: SizedBox(
width: 80,
height: 80,
child: Image.asset(mealsListData.imagePath),
),
)
],
),
),
),
);
}
#override
Widget build(BuildContext context) {
return AnimatedBuilder(
animation: animationController,
builder: (BuildContext context, Widget child) {
//InWell è un rettangolo che permett edi rispondere al touch
return InkWell(
onTap: () {
onTap(index);
print("Eseguito tap su index: " + index.toString() + "");
},
//Viene generato il child con il container dei dati
child: Container(
child: getData(),
),
);
});
}
}

Answer 1

Update*
typedef CustomCallback = void Function(int);
//Custom Callback function
class MealsView extends StatelessWidget {
const MealsView(
{Key key,
this.mealsListData,
this.animationController,
this.animation,
this.index,
this.onTap;
this.tipologiaMarcatura})
: super(key: key);
//Stringa che viene inizializzata con la tipologia della marcatura
final String tipologiaMarcatura;
final MealsListData mealsListData;
final AnimationController animationController;
final Animation<dynamic> animation;
final int index;
final CustomCallback onTap;
//wrap your Stack widget inside InkWell
InkWell(
onTap:(){
onTap(index);
//Todo
},
//Your Stack and other code goes here...
)
}
and use it in
return MealsView(onTap:(ii){
},
mealsListData: mealsListData[index],
animation: animation,
animationController: animationController,
tipologiaMarcatura: mealsListData[index].titleTxt
);