Convert/Data binding, style textblock WP7

Question

   {
      "body": "testtt",
      "from_id": 37917395,
    },
    {
      "body": "hiii",
      "from_id": 124769733,
    },

I parse this response and need that messages from id "37917395" will be on left side of textblock, and messages from id "124769733" will be on right side.Like this:

testtt

     hiii

The messages may be not in order.Like this:

testtt

This also me

 hiii

I want to develop something like this:

I think I need to use Converter. Please help me with algorithm.

What I've already have.

Answer 1

I don't think a converter alone will be enough.

Converters work on one value at a time and you need your example control to have knowledge of what the previous value (above it) was in order to change the alignment/grouping.

Best you change the type of data you are binding to. Parse the data first into a structure more suited to the display requirements. Include say a Left/Right alignment value as one of the properties. A converter would then be useful for converting that flag into an alignment.

Might be time for you to look at ViewModels:)

Answer 2

You'll need to determine if the from_id indicates if the message should be on the left or the right. You'll then need to combine this with whatever method you are using to control whehter display is on the left or the right.

I'd assume you are making your own control to display the messages. I'd also assume that you have a property to indicate if it displays on the left or right of the screen. You should bind the from_id to this property and then use the converter to do the determining of if which side the message should be.

Answer 3

if your data are put in a listbox, you need to use a DataTemplateSelector in the ItemTemplate of your listbox, with a first DataTemplate align left, and the other one align right. Just search a tutorial for DataTemplateSelector on WP7, it's exactly what you need

Answer 4

@wsevendays If each comment/record has a integer primary key then you could %2 that value (find the remainder when divided by two), which will either be 0 or 1 and use that to set a property to align the data in the UI to the left or right hand side.