如何将图像和文本块添加到WPF ContentControl

Question

I have a ContentControl in WPF,which has an image in it

ContentControl myContentControl = new ContentControl();
myContentControl.Content = image;

How do I to add a textblock next to the image inside the ContentControl? Thank you.

Answer 1

You need to change the property ContentTemplate of the contentControl, as to ContentTemplate , here is some explanation:

Gets or sets the data template used to display the content of the ContentControl.

Also you need create a class to represent your data, like this:

public class ImageInfo
{
    public string Caption { get; set; }
    public ImageSource Image { get; set; }
}

It is better to create ContentControl in XAML, like this:

    <ContentControl x:Name="cc">
        <ContentControl.ContentTemplate>
            <DataTemplate>
                <StackPanel>
                    <Image Source="{Binding Image}" />
                    <TextBlock Text="{Binding Caption}" />
                </StackPanel>
            </DataTemplate>
        </ContentControl.ContentTemplate>
    </ContentControl>

Then, assign the data to the ContentControl:

cc.Content = new ImageInfo() { Caption = "Hello", Image = new BitmapImage(new System.Uri("/Assets/User.jpg", UriKind.Relative)) };

Answer 2

What you are doing looks like you are not familiar with MVVM : Please check here

Easy Solution

But if you want the ugly solution and create UIElement s in your code behind - go like this:

    public static ContentControl CreateControl(string title, Uri path)
    {
        //Create your image
        BitmapImage bitmapImage = new BitmapImage(path);
        Image image = new Image()
        {
            Source = bitmapImage
        };

        //Create your Text
        TextBlock textB = new TextBlock()
        {
            Text = title
        };

        //Put them together
        StackPanel content = new StackPanel();
        content.Children.Add(image);
        content.Children.Add(textB);

        //Add this to the content control
        return new ContentControl()
        {
            Content = content
        };

    }