How to join a List and bind it with a TextBlock in a GridView Block

Question

I want to join a list and bind them within a TextBlock in a GridView (or ListView) block.

Let me draw a picture to explain the scenario.

C#

I have a list of StudentInfo which contains Name (string), ID (int) and Courses (List<string)

XAML

<ListView.ItemTemplate>
    <DataTemplate x:DataType="data:StudentInfo">
        <StackPanel>
            <TextBlock Text="{x:Bind StudentName}" Margin="1"/>
            <TextBlock Text="{x:Bind ID}" Margin="1"/>
            <!--In the following textblock, I want to show something like this
                "Taken Courses Are - PHY, CHM, MAT"-->
            <TextBlock Text="{x:Bind Courses}" Margin="1"/>
        </StackPanel>
    </DataTemplate>
</ListView.ItemTemplate>

In the last TextBlock I want to join all the courses a student have taken and show them with a hard coaded text -

"Taken Courses Are - ".

How can I do that?

Use converters to read values and format it as per your need. — S.N, Nov 19 '19 at 11:05
Possible duplicate of [WPF textblock binding with List](https://stackoverflow.com/questions/345385/wpf-textblock-binding-with-liststring) — S.N, Nov 19 '19 at 11:08
Please visit the duplicate link and that has answer to your question — S.N, Nov 19 '19 at 11:09
In the above link just change System.Globalization.CultureInfo culture. because is not for UWP. its for WPF — Vignesh, Nov 19 '19 at 11:18

Vignesh · Accepted Answer · 2019-11-19T11:43:23.647

3

you can simply use a IValueConverter to Bind list

<TextBlock Text="{x:Bind Courses,Converter={StaticResource ListToStringConverter}}" Margin="1"/>

Here the Converter

public class ListToStringConverter : IValueConverter
{

    public object Convert(object value, Type targetType,
        object parameter, string language)
    {    
        return String.Join(", ", ((List<string>)value).ToArray());
    }

    public object ConvertBack(object value, Type targetType,
        object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

Edit

Add ListToStringConverter to your resources

<Page.Resources>
            <local:ListToStringConverter x:Name="ListToStringConverter" ></local:ListToStringConverter>
</Page.Resources>

edited Nov 19 '19 at 11:43

answered Nov 19 '19 at 11:07

Vignesh

1,824
2
10
27

1

Hi! Your code is throwing this -- #if DEBUG && !DISABLE_XAML_GENERATED_BREAK_ON_UNHANDLED_EXCEPTION UnhandledException += (sender, e) => { if (global::System.Diagnostics.Debugger.IsAttached) global::System.Diagnostics.Debugger.Break(); }; #endif – Mahmudul Hasan Nov 19 '19 at 11:30
1

Well, I figured it out. This need to be added. – Mahmudul Hasan Nov 19 '19 at 11:43
1

I have modified – Vignesh Nov 19 '19 at 11:43

score 1 · Answer 2 · answered Nov 19 '19 at 11:10

Write a converter class to covert your list to a comma separated string.

XAML code


    <TextBlock Text="{Binding Path=Courses,Converter={StaticResource CourseToStringConverter}}" Margin="1"/>

CourseToStringConverter

[ValueConversion(typeof(List<string>), typeof(string))]
public class CourseToStringConverter: IValueConverter
{
   public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        if (targetType != typeof(string))
            throw new InvalidOperationException("The target must be a String");

        return "Taken Courses Are - " + String.Join(", ", ((List<string>)value).ToArray());
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

System.Globalization.CultureInfo culture is not for UWP. its for WPF. — Vignesh, Nov 19 '19 at 11:18
Thanks, I thought its for WPF, didn't find any where mentioned otherwise. — Shameer Mohammed, Nov 19 '19 at 11:21

How to join a List and bind it with a TextBlock in a GridView Block

2 Answers2

Edit