locked
Databinding and Page View

    Question

  • Hi All,

    I am doing the following.  However, when the page loads the tiles take up the entire space.  Normally it should be 90/90 however it does not look like the binding is holding true.  Is there something else going on?  Is the page being rendered before the size can be applied?

    Thanks for any help.

    <Grid x:Name="tile" Width="{Binding TileSize}" Height="{Binding TileSize}" HorizontalAlignment="Left">
                    <StackPanel>
                        <Grid>
                            <Border Background="{Binding Color}">
                                <Image Source="{Binding Image}" Visibility="{Binding IsVisible}" Height="{Binding ImageSize}" Width="{Binding ImageSize}" HorizontalAlignment="Center"/>
                            </Border>
                        </Grid>
                        <Grid Height="{Binding WordSize}" Width="{Binding TileSize}">
                            <StackPanel VerticalAlignment="Bottom" Visibility="{Binding IsVisible}" Background="{ThemeResource ListViewItemOverlayBackgroundThemeBrush}">
                                <TextBlock
                                    Text="{Binding Text}"
                                    Height="{Binding WordSize}"
                                    Margin="0,0,0,5"
                                    HorizontalAlignment="Center"
                                    Foreground="{ThemeResource ListViewItemOverlayForegroundThemeBrush}"
                                    Style="{StaticResource BodyTextBlockStyle}"
                                    Visibility="{Binding IsVisible}"/>
                            </StackPanel>
                        </Grid>
                    </StackPanel>
                </Grid>

    Wednesday, December 31, 2014 6:01 AM

All replies

  • Josh - there's not enough information here to understand what you're seeing. Can you share code and screenshts with us?

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Wednesday, December 31, 2014 8:18 PM
    Moderator
  • Hi Matt,

    Sure! A brief overview, you navigate to the page, it calls the view models refresh which reads in data from a data file.  It then sets the tile size that is used in the xmal.  I hope that helps?  Thanks in advance for all the help!

    So this is in my xmal

        <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">                      

            <Grid.RowDefinitions>
                <RowDefinition Height="{Binding TileSize}"/>
                <RowDefinition Height="{Binding TieSize}"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="{Binding TileSize}"/>
            </Grid.RowDefinitions>

                <controls:VariableSizedGridView
                    x:Name="messageBoard"
                    Height="Auto"
                    Grid.Column="1"
                    SelectionMode="None"                       
                    IsItemClickEnabled="True"                    
                    ItemsSource="{Binding MessageBoard}"
                    ItemTemplate="{StaticResource tileTemplate}"   <- Uses the above template in my fist post.
                    ItemClick="MessageBoard_Click"/>

    In the cs file

            /// <summary>
            /// Is called when being navigated from.
            /// </summary>
            /// <param name="e">Event data that provides navigation data.</param>
            protected override async void OnNavigatedFrom(NavigationEventArgs e)
            {
                await this.RefreshPage();

                this.NavigationHelper.OnNavigatedFrom(e);
            }

    In the view model
            /// <summary>
            /// Gets the tile's size.
            /// </summary>
            public int TileSize
            {
                get
                {
                    return this._tileSize;
                }
                private set
                {
                    this._tileSize = value;
                    this.NotifyPropertChanged("TileSize");
                }
            }


            /// <summary>
            /// Refreshes the data on the page.  This method should be called when ever being navigated to
            /// or from a page.
            /// </summary>
            public override async Task Refresh()
            {
                await base.Refresh();

                var userSettings = await UserSettingsSource.GetUserSettingsAsync();

                this.SpeakIconVisibility = userSettings.MessageBoardOnly ? Visibility.Collapsed : Visibility.Visible;
                this.MuteIconVisibility = userSettings.MessageBoardOnly ? Visibility.Visible : Visibility.Collapsed;

                TileSizes tileSize;
                Enum.TryParse<TileSizes>(userSettings.TileSize, out tileSize);

                this.TileSize = (int)tileSize;

                ImageSizes imageSize;
                Enum.TryParse<ImageSizes>(userSettings.TileSize, out imageSize);

                this.ImageSize = (int)imageSize;

                WordSizes wordSize;
                Enum.TryParse<WordSizes>(userSettings.TileSize, out wordSize);

                this.WordSize = (int)wordSize;
            }

    Thursday, January 1, 2015 9:46 PM