I can't seem to execute command binding around RadDataBoundListBox having HubTiles

2 posts, 0 answers
  1. Shah Z
    Shah Z avatar
    6 posts
    Member since:
    Jan 2009

    Posted 14 Mar 2013 Link to this post


    First of all I'm pretty new to xaml and wp8 app development.

    How can I use HubTile's command binding feature in RadDataBoundListBox?
    I know there's something to do with DataTemplate is not part of VisualTree so the command is not invoked, I have tried several ways but no luck.. hope you can help. 

    I can see the code will call the command if the HubTile if it is not part of the DataBoundListBox

    What am i missing? 

    Code snippet is provided below..

        xmlns:System="clr-namespace:System;assembly=mscorlib" FontFamily="{StaticResource PhoneFontFamilyNormal}"
        FontSize="{StaticResource PhoneFontSizeNormal}"
        Foreground="{StaticResource PhoneForegroundBrush}"
        SupportedOrientations="Portrait" Orientation="Portrait"
        <!--LayoutRoot is the root grid where all page content is placed-->
        <Grid x:Name="LayoutRoot" Background="Transparent">
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            <!--TitlePanel contains the name of the application and page title-->
            <StackPanel Grid.Row="0" Margin="12,17,0,28">
                <TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
            <!--ContentPanel - place additional content here-->
            <StackPanel x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
                <!--<telerikPrimitives:RadHubTile CommandParameter="The Parameter">
                        <MyCommand:ACommand />
                <telerikPrimitives:RadHubTile CommandParameter="The Parameter2">
                        <MyCommand:ACommand />
                <telerikPrimitives:RadHubTile Command="{Binding HelloCommand}" CommandParameter="The Parameter3" />
                <telerikPrimitives:RadDataBoundListBox x:Name="radListBox" ItemsSource="{Binding Items}" Margin="6,0,6,0" Grid.Row="3">
                            <telerikPrimitives:RadHubTile DataContext="{Binding DataContext,ElementName=LayoutRoot}" Height="100" Width="150" FontSize="20"  Title="{Binding Title}"  Command="{Binding HelloCommand}" CommandParameter="Inside datatemplate"/>
                        <telerikPrimitives:WrapVirtualizationStrategyDefinition Orientation="Horizontal" WrapLineAlignment="Center"/>

    a.xaml.cs code...
    using System.Collections.ObjectModel;
    using System.Windows;
    using System.Windows.Input;
    using Microsoft.Phone.Controls;
    using MyFinance.WindowsPhone.Core.UI;
    using MyFinance.WindowsPhone.Core.UI.Commands;
    namespace MyFinanceWinPhone.LightToolkit.Client.Views
        public partial class a : PhoneApplicationPage
            public a()
                LayoutRoot.DataContext = new aViewModel();
        public class aViewModel : GalaSoftViewModel
            public aViewModel()
                HelloCommand = new DelegateCommand(AAA, o => true);
                Items = new ObservableCollection<AnItem>
                                new AnItem
                                        Title = "Hello World"
                                new AnItem
                                        Title = "Hello World 2"
                                       new AnItem
                                        Title = "goheadgostan"
            private void AAA(object parameter)
                MessageBox.Show("Hello Command via aViewModel");
            private ObservableCollection<AnItem> _items;
            public ObservableCollection<AnItem> Items
                get { return _items; }
                set { Set("Items", ref _items, value); }
            public ICommand HelloCommand { get; set; }
        public class AnItem : GalaSoftViewModel
            private string _title;
            public string Title
                get { return _title; }
                set { Set("Title", ref _title, value); }

    The base ViewModel
    using GalaSoft.MvvmLight;
    namespace MyFinance.WindowsPhone.Core.UI
        public class GalaSoftViewModel : ViewModelBase
            public GalaSoftViewModel()
                BroadCast = false;
            private string _applicationTitle = "No Application Title";
            public virtual string ApplicationTitle
                get { return _applicationTitle; }
                    _applicationTitle = value;
            private string _pageTitle = "No page title";
            public virtual string PageTitle
                get { return _pageTitle; }
                    _pageTitle = value;
            public bool BroadCast { get; set; }

    Please help...

  2. Victor
    Victor avatar
    1349 posts

    Posted 15 Mar 2013 Link to this post

    Hi Shah,

    The data context of your hub tile inside the ItemTemplate will be a AnItem object. You will only be able to bind to its poperties. If you want to have access to a global command, every AnItem object should expose a property that points to this command (that's the purpose of a view model anyway, to glue together your models and the view). In this case you will have access only to the Title property.

    Also, you should not set the DataContext of your hub tiles explicitly.

    I hope this helps.

    the Telerik team
    Have a suggestion or face a problem - you can use the Ideas & Feedback portal to submit ideas, feedback and vote for them.
  3. DevCraft banner
Back to Top