Max
Max

Reputation: 1301

How to fix the button always at the end of the list in Flutter?

I have a list of amenities which is wrapped in a Wrap widget. At the end of the list I have the Other button - this button should always be at the end of the list. But I have a problem that when I add a new element to this list, then the Other button does not move to the end, but stays on its own together. Can you please tell me how to make sure that when adding new elements, the Other button always remains at the end?

body

Wrap(
   runSpacing: 8,
   children: [
       for (int i = 0; i < defaultAmenities.length; i++) 
         amenityCard(i),
   ],
),




Widget amenityCard(int i) {
    return Padding(
      padding: const EdgeInsets.only(right: 6),
      child: GestureDetector(
        onTap: () {
          if (defaultAmenities.keys.elementAt(i) == 'Other') {
            setState(() {
              isOther = true;
            });
          } else {
            setState(() {
              if (selectedAmenities
                  .contains(defaultAmenities.keys.elementAt(i))) {
                selectedAmenities.removeWhere(
                  (element) => element == defaultAmenities.keys.elementAt(i),
                );
              } else {
                selectedAmenities.add(defaultAmenities.keys.elementAt(i));
              }
            });
          }

          widget.onAmenitiesChanged(selectedAmenities);
        },
        child: Container(
          width: 20 + defaultAmenities.keys.elementAt(i).length * 13,
          alignment: Alignment.center,
          height: 40,
          child: Padding(
            padding: const EdgeInsets.symmetric(horizontal: 4),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                const SizedBox(width: 3),
                Text(
                  defaultAmenities.keys.elementAt(i),
                  style: TextStyle(
                    color: selectedAmenities
                            .contains(defaultAmenities.keys.elementAt(i))
                        ? constants.Colors.green
                        : Colors.white.withOpacity(0.5),
                    fontFamily: constants.FontFamily.AvenirLtStd,
                    fontWeight: FontWeight.w300,
                    fontSize: 16,
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

Map<String, String> defaultAmenities = {
  'Free Wifi': constants.Assets.wifi,
  'Restroom': constants.Assets.amenitiesRestroom,
  'Cafe': constants.Assets.amenitiesCafe,
  'Other': constants.Assets.add,
};

Upvotes: 0

Views: 71

Answers (1)

Sayyid J
Sayyid J

Reputation: 1561

there is two ways. first : separating it into 2 lists:

Wrap(
   runSpacing: 8,
   children: [
       for (int i = 0; i < defaultAmenities.length; i++) 
         amenityCard(i),
   ] + [ // other ametyCard],
),

second : instead of add you can use insert at index , index must be list lenght -2, because other is the last index;

selectedAmenities.insert(selectedAmenities.lenght -2 ,defaultAmenities.keys.elementAt(i));

Upvotes: 1

Related Questions