Bring first item in collection into view

2 posts, 1 answers
  1. Boots
    Boots avatar
    81 posts
    Member since:
    Dec 2008

    Posted 14 Jan 2011 Link to this post

    Hello,

    Currently we're using a ListCollectionView to filter the items in the carousel. After I refresh the ListCollectionView I call BringDataitemIntoView(NameOfMyView.CurrentItem) with the carousel. But it isn't bringing the first item in the collection into view. I was wondering if you had any ideas on what I'm doing wrong? Below is a simple example of what I'm hitting.

    Also I noticed if we type in 10, 11, 12, 13, or 14 it doesn't scroll anything into view.

    I'm using versions 2010.3.1110.35 and 2010.1.603.35 (in an already released product)


    <Window
        x:Class="CarouselTest2.MainWindow"
        xmlns:local="clr-namespace:CarouselTest2"
        Title="MainWindow" Height="350" Width="525">
         
        <Window.Resources>
             
            <DataTemplate DataType="{x:Type local:Item}">
                <Border BorderBrush="Black" BorderThickness="2" CornerRadius="5">
                    <Grid>
                        <Label Content="{Binding Path=Value}" />
                    </Grid>
                </Border>
            </DataTemplate>
             
        </Window.Resources>
         
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>       
             
            <TextBox x:Name="txtBox" Grid.Row="0" TextChanged="TextBox_TextChanged" />
             
            <telerik:RadCarousel
                x:Name="Carousel"
                Grid.Row="1"
                Focusable="False"
                AutoGenerateDataPresenters="False"
                HorizontalScrollBarVisibility="Hidden"
                VerticalScrollBarVisibility="Visible">
                <telerik:RadCarousel.ItemsPanel>
                    <ItemsPanelTemplate>
                        <telerik:RadCarouselPanel
                            ItemsPerPage="7"
                            IsOpacityEnabled="False"
                            PathPadding="0">
                            <!--<telerik:RadCarouselPanel.Path>
                                <Path Stretch="Fill">
                                    <Path.Data>
                                        <LineGeometry StartPoint="0, 800" EndPoint="0, 10" />
                                    </Path.Data>
                                </Path>
                            </telerik:RadCarouselPanel.Path>-->
                        </telerik:RadCarouselPanel>
                    </ItemsPanelTemplate>
                </telerik:RadCarousel.ItemsPanel>
            </telerik:RadCarousel>
     
        </Grid>
    </Window>
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Data;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Imaging;
    using System.Windows.Navigation;
    using System.Windows.Shapes;
    using System.Collections;
     
    namespace CarouselTest2
    {
        /// <summary>
        /// Interaction logic for MainWindow.xaml
        /// </summary>
        public partial class MainWindow : Window
        {
            ListCollectionView view;
     
            public MainWindow()
            {
                InitializeComponent();
     
     
                List<Item> Items = new List<Item>();
                for (int i = 0; i < 150; i++)
                {
                    Items.Add(new Item(i));
                }
     
                view = new ListCollectionView(Items.ToList());
                view.Filter = new Predicate<object>(FilterObject);
                this.Carousel.ItemsSource = view;
            }
     
            private bool FilterObject(object itemToFilter)
            {
                if (itemToFilter == null)
                    return false;
     
                String filterText = this.txtBox.Text.ToUpper();
                 
                if (filterText.Length == 0)
                    return true;
                 
                return ((itemToFilter as Item).Value.ToString().Contains(filterText));
     
            }
     
            private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
            {
                this.view.Refresh();
                this.Carousel.BringDataItemIntoView(this.view.CurrentItem);
                 
            }
        }
     
        public class Item
        {
            public Item(int i)
            {
                this.Value = i;
            }
     
            public int Value { get; set; }
        }
     
    }

    Thanks Much,
    ~Boots
  2. Answer
    Yordanka
    Admin
    Yordanka avatar
    634 posts

    Posted 17 Jan 2011 Link to this post

    Hello Boots,

    You need to set AutoLoadItems property to False and your solution will work as expected. However, when the carousel is shown items won't be loaded automatically. If you need this you may subscribe to Loaded event and scroll the RadCarouselPanel content by one page:

    private void RadCarouselPanel_Loaded(object sender, RoutedEventArgs e)
            {
                var panel = sender as RadCarouselPanel;
     
                panel.PageDown();
            }

    I hope this helps.
     
    Best wishes,
    Yordanka
    the Telerik team
    Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
  3. UI for WPF is Visual Studio 2017 Ready
Back to Top