How to access a property from another class / control, from within a custom class?

Question

I'm trying to replicate the messaging system of windows phones, but with another service. I'm using the Chat Bubble control from the Coding4Fun Toolkit for Windows Phone to do this.

(Screenshot of the Chat Bubble control):

The code I came up with below works fine, however the ChatBubbleDirection property within my datatemplate produces an error when it's databound. This is because I don't know how to use a property from another class (if this makes sense?). How would this be done? I just couldn't figure it out...

The XAML property should look like this:

ChatBubbleDirection="LowerLeft"

As you can guess, this will determine the direction of the little arrow of the ChatBubble.

Here's the code for the message class:

using Coding4Fun.Phone.Controls.Toolkit.Common;

public class Message : Coding4Fun.Phone.Controls.ChatBubble
{
    public string Text { get; set; }
    public string SendingDate { get; set; }
    //public Coding4Fun.Phone.Controls.ChatBubble { get; set; }
}

And here's the code for the button click event:

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        LBmessages.ItemsSource = messages;
        Message m = new Message();
        m.SendingDate = "Today";
        m.Text = "This is a message";
        //m.direction = (Coding4Fun.Phone.Controls.ChatBubble).ChatBubbleDirectionProperty???
        messages.Add(m);
    }

And here's the XAML:

    <StackPanel x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <ScrollViewer Height="369" Name="scrollviewer1" Width="500">
            <ListBox Name="LBmessages" Height="250">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Width="456">
                            <cc:ChatBubble Width="500" Margin="0,0,0,20"  ChatBubbleDirection="{Binding direction}">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"></RowDefinition>
                                    <RowDefinition Height="40"></RowDefinition>
                                </Grid.RowDefinitions>
                                <TextBlock Text="{Binding Text}" TextWrapping="Wrap" Width="430"></TextBlock>
                                <TextBlock Grid.Row="1" HorizontalAlignment="Right" Text="{Binding SendingDate}"></TextBlock>
                            </Grid>
                        </cc:ChatBubble>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
       </ScrollViewer>
    </StackPanel>

Does anybody have any idea what I should write in the Message class? I really don't know how to explain my problem any further. I have tried extending the ChatBubble class within my Message class (as you can see), but with no avail.

Thanks in advance for any help!

Answer 1

Your message class needs to have a publicly exposed property called Direction, which you will bind to ChatBubbleDirection of ChatBubble.

private string direction;

public string Direction
{
    get { return direction; }
    set { direction = value; }
}

ChatBubbleDirection can be one of the following

• UpperRight
• UpperLeft
• LowerRight
• LowerLeft

That should work I think.

More info can be found here on WindowsPhoneGeek.