Can't Find Element in WinRT XAML

Question

I have the following CustomControl that I want to use as a base for a Banner:

XAML:

C#:

public sealed partial class BannerPanel : UserControl
{
    /// 
    /// Title of the Banner
    /// 
    public string Title
    {
        get { return _Title.Text; }
        set { _Title.Text = value; }
    }

    /// 
    /// The visibility of the OK button
    /// 
    public Visibility OKVisibility
    {
        get { return _OK.Visibility; }
        set { _OK.Visibility = value; }
    }

    /// 
    /// The visibility of the Cancel button
    /// 
    public Visibility CancelVisibility 
    {
        get { return _Cancel.Visibility; }
        set { _Cancel.Visibility = value; }
    }

    /// 
    /// The inner content of the panel
    /// 
    public FrameworkElement InnerContent 
    {
        get { return (FrameworkElement)_Content.Content; }
        set { _Content.Content = value; }
    }

    /// 
    /// Fires when the Ok button is clicked
    /// 
    public event RoutedEventHandler OkClick;

    /// 
    /// Fires when the Cancel button is clicked
    /// 
    public event RoutedEventHandler CancelClick;
};

But when I use it (see the following XAML), the autogenerated code does not find the elements in the inner content:

XAML:

C#:

public sealed partial class TermsBanner : UserControl
{
    /// 
    /// Constructor
    /// 
    public TermsBanner()
    {
        this.InitializeComponent();

        // Why do I have to find TermsText Manually like this??????
        TermsText = (Banner.InnerContent as ScrollViewer).Content as TextBlock;
        TermsText.Text = TermsOfUse;
    }
};

Why do I have to manually point the variable TermsText to the correct thing? Why can't it automatically find it with FindName() like it usually does?

Filip Skakun · Accepted Answer

You should define DependencyProperty properties instead of regular ones.
Derive from ContentControl instead of UserControl.
Put your XAML in Themes/Generic.xaml in a Style/Setter/Property="Template" Value=".... It happens automatically if you create the control using the Templated Control VS item template.
Use TemplateBinding to bind properties of inner template elements to your control properties.

FindName might not work across namescopes. I never use it.

excuse the typos. Typed on a phone.

Here's a solution:

Created templated control (also known us custom control - not to be confused with a UserControl) and modified it to derive from ContentControl instead of Control:

using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

// The Templated Control item template is documented at http://go.microsoft.com/fwlink/?LinkId=234235

namespace App124
{
    [TemplatePart(Name = "_OK", Type = typeof(Button))]
    [TemplatePart(Name = "_Cancel", Type = typeof(Button))]
    public sealed class BannerPanel : ContentControl
    {
        #region Title
        /// 
        /// Title Dependency Property
        /// 
        public static readonly DependencyProperty TitleProperty =
            DependencyProperty.Register(
                "Title",
                typeof(string),
                typeof(BannerPanel),
                new PropertyMetadata(null, OnTitleChanged));

        /// 
        /// Gets or sets the Title property. This dependency property 
        /// indicates ....
        /// 
        public string Title
        {
            get { return (string)GetValue(TitleProperty); }
            set { SetValue(TitleProperty, value); }
        }

        /// 
        /// Handles changes to the Title property.
        /// 
        /// 
        /// The  on which
        /// the property has changed value.
        /// 
        /// 
        /// Event data that is issued by any event that
        /// tracks changes to the effective value of this property.
        /// 
        private static void OnTitleChanged(
            DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var target = (BannerPanel)d;
            string oldTitle = (string)e.OldValue;
            string newTitle = target.Title;
            target.OnTitleChanged(oldTitle, newTitle);
        }

        /// 
        /// Provides derived classes an opportunity to handle changes
        /// to the Title property.
        /// 
        /// The old Title value
        /// The new Title value
        private void OnTitleChanged(
            string oldTitle, string newTitle)
        {
        }
        #endregion

        #region OKVisibility
        /// 
        /// OKVisibility Dependency Property
        /// 
        public static readonly DependencyProperty OKVisibilityProperty =
            DependencyProperty.Register(
                "OKVisibility",
                typeof(Visibility),
                typeof(BannerPanel),
                new PropertyMetadata(Visibility.Visible, OnOKVisibilityChanged));

        /// 
        /// Gets or sets the OKVisibility property. This dependency property 
        /// indicates ....
        /// 
        public Visibility OKVisibility
        {
            get { return (Visibility)GetValue(OKVisibilityProperty); }
            set { SetValue(OKVisibilityProperty, value); }
        }

        /// 
        /// Handles changes to the OKVisibility property.
        /// 
        /// 
        /// The  on which
        /// the property has changed value.
        /// 
        /// 
        /// Event data that is issued by any event that
        /// tracks changes to the effective value of this property.
        /// 
        private static void OnOKVisibilityChanged(
            DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var target = (BannerPanel)d;
            Visibility oldOKVisibility = (Visibility)e.OldValue;
            Visibility newOKVisibility = target.OKVisibility;
            target.OnOKVisibilityChanged(oldOKVisibility, newOKVisibility);
        }

        /// 
        /// Provides derived classes an opportunity to handle changes
        /// to the OKVisibility property.
        /// 
        /// The old OKVisibility value
        /// The new OKVisibility value
        private void OnOKVisibilityChanged(
            Visibility oldOKVisibility, Visibility newOKVisibility)
        {
        }
        #endregion

        #region CancelVisibility
        /// 
        /// CancelVisibility Dependency Property
        /// 
        public static readonly DependencyProperty CancelVisibilityProperty =
            DependencyProperty.Register(
                "CancelVisibility",
                typeof(Visibility),
                typeof(BannerPanel),
                new PropertyMetadata(Visibility.Visible, OnCancelVisibilityChanged));

        /// 
        /// Gets or sets the CancelVisibility property. This dependency property 
        /// indicates ....
        /// 
        public Visibility CancelVisibility
        {
            get { return (Visibility)GetValue(CancelVisibilityProperty); }
            set { SetValue(CancelVisibilityProperty, value); }
        }

        /// 
        /// Handles changes to the CancelVisibility property.
        /// 
        /// 
        /// The  on which
        /// the property has changed value.
        /// 
        /// 
        /// Event data that is issued by any event that
        /// tracks changes to the effective value of this property.
        /// 
        private static void OnCancelVisibilityChanged(
            DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var target = (BannerPanel)d;
            Visibility oldCancelVisibility = (Visibility)e.OldValue;
            Visibility newCancelVisibility = target.CancelVisibility;
            target.OnCancelVisibilityChanged(oldCancelVisibility, newCancelVisibility);
        }

        /// 
        /// Provides derived classes an opportunity to handle changes
        /// to the CancelVisibility property.
        /// 
        /// The old CancelVisibility value
        /// The new CancelVisibility value
        private void OnCancelVisibilityChanged(
            Visibility oldCancelVisibility, Visibility newCancelVisibility)
        {
        }
        #endregion

        /// 
        /// Fires when the Ok button is clicked
        /// 
        public event RoutedEventHandler OkClick;

        /// 
        /// Fires when the Cancel button is clicked
        /// 
        public event RoutedEventHandler CancelClick;

        public BannerPanel()
        {
            this.DefaultStyleKey = typeof(BannerPanel);
        }

        protected override void OnApplyTemplate()
        {
            base.OnApplyTemplate();

            var cancelButton = (Button)GetTemplateChild("_Cancel");
            var okButton = (Button)GetTemplateChild("_OK");
            cancelButton.Click += CancelClick;
            okButton.Click += OkClick;
        }
    }
}

Updated Themes/Generic.xaml to this:

This is how it's used in MainPage.xaml:

and MainPage.xaml.cs code behind:

using Windows.UI.Popups;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

// The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=234238

namespace App124
{
    /// 
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// 
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        private void OnTermsAccepted(object sender, RoutedEventArgs e)
        {
            new MessageDialog(TermsText.Text).ShowAsync();
        }
    }
}

Can't Find Element in WinRT XAML

Answers (1)

Related Questions

Can&#39;t Find Element in WinRT XAML

Answers (1)

Related Questions

Can't Find Element in WinRT XAML