Set textBlock text that is inside a datatemplate from C# (XAML)

Question

I'm starting to try to create a modern app with C# and XAML. I've already worked with C# but I never touched in a XAML or WPF piece of code, so I've a beginner question..

I'm using a MSFT template Hub App (XAML) but I don't know how can I set the text value on a TextBlock through the C# code if that textblock is inside the datatemplate.

Is there somebody who can help me with this one?

I already googled for it but I can't get any site with that answer/explanation.

This is an example about what I'm trying to do:

XAML:

<DataTemplate >
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <Image Source="Assets/MediumGray.png" Stretch="Fill" Width="420" Height="280"/>
                        <TextBlock Style="{StaticResource SubheaderTextBlockStyle}" Grid.Row="1" Margin="0,10,0,0" TextWrapping="Wrap"  
                                   x:Uid="Section1Subtitle" Text="{Binding Score}"/>
                        <TextBlock x:Name="desc"  Grid.Row="2" Margin="0,10,0,0" 
                                   x:Uid="DescriptionHeader" Text="{Binding Test}"/>
                        <TextBlock x:Name="texttest" Grid.Row="3"
                                   Text="{Binding Name}"/>
                    </Grid>
</DataTemplate>

C# code:

public class Class1
  {
        string name = "This is a test";

        public string Name
        {
            get { return name; }
            set { name = value; }
        }
    }

What am I doing wrong here?

Thanks in advance,

Answer 1

Problem solved.

Thanks a lot for you help.

Here is the code with the changed which allow me to get the variable from C#:

<DataTemplate>
                    <Grid>
                        <Grid.DataContext>
                            <local:Class1/>
                        </Grid.DataContext>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <Image Source="Assets/MediumGray.png" Stretch="Fill" Width="420" Height="280"/>
                        <TextBlock Style="{StaticResource SubheaderTextBlockStyle}" Grid.Row="1" Margin="0,10,0,0" TextWrapping="Wrap"  
                                   x:Uid="Section1Subtitle" Text="{Binding Score}"/>
                        <TextBlock x:Name="desc"  Grid.Row="2" Margin="0,10,0,0" 
                                   x:Uid="DescriptionHeader" Text="{Binding Test}"/>
                        <TextBlock x:Name="texttest" Grid.Row="3"
                                   Text="{Binding Name}"/>
                    </Grid>
                </DataTemplate>

Answer 2

This one will also walks you through many aspects of the WP development, including using devices, live tiles, etc: http://www.jeffblankenburg.com/2011/10/31/31-days-of-mango/

It's a bit old though.

Answer 3

Usually there is no way to set something inside of a DataTemplate easily in c# code. However, there are some messy ways to do it through binding, converters, and selectors.

Answer 4

XAML provides a simple and powerful way to auto-update data between the business model and the user interface. This mechanism is called DataBinding. Everytime when the data of your business model changes, it automatically reflects the updates to the user interface and vice versa. This is the preferred method in WPF to bring data to the user interface.

Databinding can be unidirectional (source -> target or target <- source), or bidirectional (source <-> target).

try out the link Learn XAML .

Answer 5

In abstraction, a DataTemplate is a Visual representation of a certain piece of Data .

UI elements inside a DataTemplate should reflect the state of such piece of data.

In XAML-based technologies, DataBinding helps in keeping the UI in sync with the data, using really clean and beautiful declarative means, as opposed to traditional procedural programming.

So, say you have a certain piece of data, like:

public class Person
{
    public string FirstName {get;set;}

    public string LastName {get;set;}
}

Then you may have a DataTemplate which represents that data, like:

<DataTemplate DataType="local:Person">
   <StackPanel>
      <TextBlock Text="{Binding LastName}"/>
      <TextBlock Text="{Binding FirstName}"/>
   </StackPanel>
</DataTemplate>

The key is in the {Binding} declarations.

See the above linked MSDN article for more information.