'Calculation based on index (e.g. 50*index to change width of containers) AND dynamic navigation from indexed titles

Here is my code below. I have tried using _navigation.indexOf and .indexWhere but both want to return integers and won't let me convert them into num dataTypes. I am hoping to generate at least 5 containers that decrease in size (e.g. 450 - 50*index) that can function as navigation buttons. If this cant work with a listview.builder, would a for loop be an option instead?

import 'package:flutter/material.dart';

class Navigation {
  final String title;

  Navigation(this.title);
}

class HomeScreen extends StatelessWidget {
  static const String id = '/';

  List<Navigation> _navigation = [
    Navigation('Title1'),
    Navigation('Title2'),
    Navigation('Title3'),
    Navigation('Title4'),
    Navigation('Title5'),
  ];

  int findIndex(List<Navigation> _navigation, String buttonName) {
    final getIndex =
        _navigation.indexWhere((element) => element.title == buttonName);
    return getIndex;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: null,
        body: ListView.builder(
            itemCount: _navigation.length,
            itemBuilder: (BuildContext nav, int index) {
              return TextButton(
                  onPressed: () {
                    Navigator.pushNamed(context, _navigation[index].title);
                  },
                  child: Container(
                      height: 50,
                      width: 450,
                      child: Text(
                        '${_navigation[index].title}',
                        textAlign: TextAlign.end,
                      )));
            }));
  }
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source