Dynamically add textviews to custom adapter from ArrayList

Question

I use a custom adapter to show list items which have an image, a title and an N amount of individual strings within each list item beneath the title.

How do I implement N amount of TextViews with the city title within the com.google.android.flexbox.FlexboxLayout of each list item? The N amount of TextViews comes from ArrayList<City>

public City (String city, int id) {
        this.city = city;
        this.id = id; 
}

Thanks!

Problem visualization here

Adapter:

    public class PersonAdapter extends ArrayAdapter<Person> {

    private ArrayList<City> cities;

    public PersonAdapter(Context context, ArrayList<Person> persons) {
        super(context, 0, persons);
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        // Hole Daten für diese Position
        Person person = getItem(position);

        cities = person.getCities();

        if (convertView == null) {

            convertView = LayoutInflater.from(getContext())
    .inflate(R.layout.list_explore_people_row, parent, false);
        }

        TextView personName = (TextView) convertView.findViewById(R.id.listItemExplorePeopleName);
        ImageView profileImg = (ImageView) convertView.findViewById(R.id.listItemExplorePeopleImg);
        TextView profileCity = (TextView) convertView.findViewById(R.id.listItemExplorePeopleCityItem);

        personName.setText(person.getName());
        profileCity.setText(person.getCities().toString()); //This is my best progress currently
        profileImg.setImageBitmap(getBitmap(getContext(), person.getProfileImg()));

        return convertView;
    }

    public Bitmap getBitmap(Context ctx, String profileFilename) {
    ...code of getBitmap for image
    }
}

XML Layout for PersonAdapter(R.layout.list_explore_people_row)

    <?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/colorWhite"
    android:paddingBottom="@dimen/list_row_vertical_margin"
    android:paddingLeft="@dimen/list_row_horizontal_margin"
    android:paddingRight="@dimen/list_row_horizontal_margin"
    android:paddingTop="@dimen/list_row_vertical_margin">

    <ImageView
        android:id="@+id/listItemExplorePeopleImg"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentStart="true"
        android:layout_alignParentTop="true"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="0dp"
        android:minHeight="100dp"
        android:minWidth="100dp"
        android:scaleType="centerCrop"
        android:src="@drawable/profileimg1" />

    <TextView
        android:id="@+id/listItemExplorePeopleName"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_marginBottom="2dp"
        android:layout_toEndOf="@+id/listItemExplorePeopleImg"
        android:ellipsize="end"
        android:singleLine="true"
        android:text="Mona"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <com.google.android.flexbox.FlexboxLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/listItemExplorePeopleName"
        android:layout_toEndOf="@+id/listItemExplorePeopleImg"
        app:flexWrap="wrap"

        android:layout_alignParentEnd="true"
        android:id="@+id/include">

        <TextView
            android:id="@+id/listItemExplorePeopleCityItem"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="city one"
            android:background="@android:color/holo_green_light"></TextView>

    </com.google.android.flexbox.FlexboxLayout>

Answer 1

for(City city : cities) {
    TextView textView = new TextView(this);
    textView.setText(person.getCities().toString());
    convertView.addView(textView);
}

I'm not currently near my main PC, so I can't actually check it, but the idea is roughly this. For more check this: Android dynamically add views