How to concatenate the values of two Columns into One inside ListView

Question

I have a .xaml file which has a listview. Listview has 2 items inside which are bind in a following way:

<ListView  Name="listView" ItemsSource="{Binding DeviceList}" SelectedItem="{Binding ConnectedDevice, Mode=TwoWay}" >
        <ListView.View>
            <GridView>
                <GridViewColumn Width="300" Header="Name" DisplayMemberBinding="{Binding Description}" />
                <GridViewColumn Width="240" Header="Connection Status" DisplayMemberBinding="{Binding DeviceName}" />
            </GridView>
        </ListView.View>
    </ListView>

Both Description and Devicename are part of ModelClass.In My ViewModel class I am able to extract the Device name as well as Description from the hardware I have connected.

    public ObservableCollection<ComDeviceInfo> DeviceList
    {
        get { return comDevices; }
        set
        {
            comDevices = value;
            NotifyPropertyChanged("DeviceList");
        }
    }

    public ComDeviceInfo ConnectedDevice
    {
        get { return connectedDevice; }
        set
        {
            connectedDevice = value;
            NotifyPropertyChanged("ConnectedDevice");
        }
    }        

    //Called Inside Constructor
    private void checkForDevicesTimer_Elapsed(Object source, ElapsedEventArgs e)
    {            
        DeviceList = ComDeviceManagement.FindDevices();            
    }

Here ComDeviceManagement is my class which has FINDDevices() which returns me the devicename and description. U can notice DeviceList = ComDeviceManagement.FindDevices() above which indicates both the descrip and name are present inside the list.

Everything is working fine. But What I basically want is to display both the Devicename and Description in One Column rather than two separate columns. Well the problem I am facing here is with Devicename and Description. Even though they both display different values, Isn't their a way where I can concatinate them and display both the values into a single Column??? You may notice another column in .xaml file but I want to display(concatenate) both these inside my single column in listView. How can i do that?

Please help!!

Answer 1

Use a MultiBinding with a format string.

<GridViewColumn>
    <TextBlock>
        <!-- the Text property is of type System.String -->
        <TextBlock.Text>
            <MultiBinding StringFormat="{0} {1}">
                <Binding Path="Description "/>
                <Binding Path="Name"/>
             </MultiBinding>
         </TextBlock.Text>
     </TextBlock> 
</GridViewColumn>

The thing you have to understand with a MultiBinding is that if the target property is not a string then you must provide a converter. If it is a string , you can get away with just using the format string.

So, in your case, you can't use it (easily) via the DisplayMemberBinding, you have to specify the content as in my example above.

Answer 2

Two approaches

In the ComDeviceInfo class just add a property that concatenates

  public string DescName 
  {
      get 
      {
           return Description + " " + Name;
      }
  {

<GridViewColumn Width="300" Header="Name" DisplayMemberBinding="{Binding DescName}" />

Or use a multi-value converter

MultiBinding.Converter

Will provided and example.

Answer 3

I would add a new property, but don't forget to update it too when its components change.

 private ComDeviceInfo _model;

 public string DeviceName
 {
     get { return _model.Name; }
     set
     {
         _model.Name = value;
         NotifyPropertyChanged("DeviceName");
         NotifyPropertyChanged("Combined");
     }
 }
 public string Description
 {
     get { return _model.Description; }
     set
     {
         _model.Description = value;
         NotifyPropertyChanged("Description");
         NotifyPropertyChanged("Combined");
     }
 } 
 public string Combined
 {
     get { return string.Format("{0} : {1}", _description, _deviceName; }
 }

Answer 4

If you are using LINQ query to get your data you can do this:

var query = from devices in DeviceList
            select new
            {.DeviceDesc = devices.device + " " devices.desc}

listview.ItemsSource = query;

Then go into the GridView.Column and use:

DisplayMemberBinding="{Binding DeviceDesc}" 

and it will bind the concatenated column you just created. Obviously you will need to write the correct query, mine was just an example to go by...