locked
HubSection DataTemplate problem

    Question

  • Hello, I am  workin on hub control and everything were well however I realized that I can not access items in HubSection.

    I have put items into HubSection DataTemplate and renamed them. I want to access them in .cs page.

    Thanks, Beray


    Beray Benteşen

    Thursday, September 4, 2014 6:36 AM

Answers

  • Hi Beray,

    yes, that's true, the items are in the DataTemplate and so not accessible directly in the codebehind.

    Options:

    1. Create UserControls and add those to your Hubsections. Then you can do stuff in the codebehind of those UserControls

    2. Use MVVM, then you just bind in your DataTemplate to your ViewModel and you can do everything in your ViewModel

    3. Walk the Visual Tree with the VisualTreeHelper to grab the Controls in a HubSection to for example attach event handlers to them

    4. ...


    Thomas Claudius Huber

    "If you can't make your app run faster, make it at least look & feel extremly fast"

    My latest Pluralsight-course: Windows Store Apps - Data Binding in Depth

    twitter: @thomasclaudiush
    homepage: www.thomasclaudiushuber.com
    author of: ultimate Windows Store Apps handbook | ultimate WPF handbook | ultimate Silverlight handbook

    Thursday, September 4, 2014 6:59 AM
  • Hi Beray

    To access into UserControl is not a difficult thing, set a DependencyProperty for control visibility inside usercontrol and set false outside will also make target control invisible. Here is a really easy way to do this: 

    UserControl XAML:

    <UserControl
        x:Class="App179.MyUserControl1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:App179"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        d:DesignHeight="300"
        d:DesignWidth="400">
        
        <Grid>
            <Button x:Name="bt" Content="Button" HorizontalAlignment="Left" Height="101" Margin="87,106,0,0" VerticalAlignment="Top" Width="165"/>
        </Grid>
    </UserControl>

    UserControl CS:

        public sealed partial class MyUserControl1 : UserControl
        {
            public MyUserControl1()
            {
                this.InitializeComponent();
            }
            public Visibility buttonVisibility
            {
                get { return bt.Visibility; }
                set { bt.Visibility = (Visibility)value; }
            }
        }

    MainPage.CS

            private void logo4_Click(object sender, RoutedEventArgs e)
            {
                // click me to make button invisible.
                uc.buttonVisibility = Windows.UI.Xaml.Visibility.Collapsed;
    
            }

    --James


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Tuesday, September 16, 2014 7:35 AM
    Moderator

All replies

  • Hi Beray,

    yes, that's true, the items are in the DataTemplate and so not accessible directly in the codebehind.

    Options:

    1. Create UserControls and add those to your Hubsections. Then you can do stuff in the codebehind of those UserControls

    2. Use MVVM, then you just bind in your DataTemplate to your ViewModel and you can do everything in your ViewModel

    3. Walk the Visual Tree with the VisualTreeHelper to grab the Controls in a HubSection to for example attach event handlers to them

    4. ...


    Thomas Claudius Huber

    "If you can't make your app run faster, make it at least look & feel extremly fast"

    My latest Pluralsight-course: Windows Store Apps - Data Binding in Depth

    twitter: @thomasclaudiush
    homepage: www.thomasclaudiushuber.com
    author of: ultimate Windows Store Apps handbook | ultimate WPF handbook | ultimate Silverlight handbook

    Thursday, September 4, 2014 6:59 AM
  • Hi Beray,

    yes, that's true, the items are in the DataTemplate and so not accessible directly in the codebehind.

    Options:

    1. Create UserControls and add those to your Hubsections. Then you can do stuff in the codebehind of those UserControls

    2. Use MVVM, then you just bind in your DataTemplate to your ViewModel and you can do everything in your ViewModel

    3. Walk the Visual Tree with the VisualTreeHelper to grab the Controls in a HubSection to for example attach event handlers to them

    4. ...


    Thomas Claudius Huber

    "If you can't make your app run faster, make it at least look & feel extremly fast"

    My latest Pluralsight-course: Windows Store Apps - Data Binding in Depth

    twitter: @thomasclaudiush
    homepage: www.thomasclaudiushuber.com
    author of: ultimate Windows Store Apps handbook | ultimate WPF handbook | ultimate Silverlight handbook


    Thanks, the other interesting situation is I can not access user controls too. I can not set visibility in .cs page. I think this situation is not meaningful. :)

    Beray Benteşen

    Thursday, September 4, 2014 7:03 AM
  • Hi Beray

    To access into UserControl is not a difficult thing, set a DependencyProperty for control visibility inside usercontrol and set false outside will also make target control invisible. Here is a really easy way to do this: 

    UserControl XAML:

    <UserControl
        x:Class="App179.MyUserControl1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="using:App179"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        mc:Ignorable="d"
        d:DesignHeight="300"
        d:DesignWidth="400">
        
        <Grid>
            <Button x:Name="bt" Content="Button" HorizontalAlignment="Left" Height="101" Margin="87,106,0,0" VerticalAlignment="Top" Width="165"/>
        </Grid>
    </UserControl>

    UserControl CS:

        public sealed partial class MyUserControl1 : UserControl
        {
            public MyUserControl1()
            {
                this.InitializeComponent();
            }
            public Visibility buttonVisibility
            {
                get { return bt.Visibility; }
                set { bt.Visibility = (Visibility)value; }
            }
        }

    MainPage.CS

            private void logo4_Click(object sender, RoutedEventArgs e)
            {
                // click me to make button invisible.
                uc.buttonVisibility = Windows.UI.Xaml.Visibility.Collapsed;
    
            }

    --James


    <THE CONTENT IS PROVIDED "AS IS" WITHOUT WARRANTY OF ANY KIND, WHETHER EXPRESS OR IMPLIED>
    Thanks
    MSDN Community Support

    Please remember to "Mark as Answer" the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

    Tuesday, September 16, 2014 7:35 AM
    Moderator