Radcarousel image choosing using button?

[Edwin]

i have a problem for radcarousel is that i wish to click the GO button(radbutton1) and show me the "image.png" in radcarousel and the BACK(radbutton2) button to show me the "U-turn_icon.png" in radcarousel. Because at later part i wish to make a 3rd button also click to show me another different image example "clipart_map.gif".

XAML CODE

<Window x:Class="WpfApplication2.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
        xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls.Carousel;assembly=Telerik.Windows.Controls.Navigation"
        Title="MainWindow" Height="886" Width="1024" Loaded="Window_Loaded">

    <Grid Height="1005">
        <telerik:RadButton Content="Go" Height="34" HorizontalAlignment="Left" Margin="12,429,0,0" Name="Gobutton" VerticalAlignment="Top" Width="80" Click="radButton1_Click" />
        <telerik:RadButton Content="Back" Height="42" HorizontalAlignment="Left" Margin="12,501,0,0" Name="Backbutton" VerticalAlignment="Top" Width="80" Click="radButton2_Click" />
        <telerik:RadToggleButton Content="Lock" Height="54" HorizontalAlignment="Left" IsChecked="False" IsThreeState="False" Margin="12,344,0,0" Name="Lockbutton" VerticalAlignment="Top" Width="80" />
        <telerik:RadComboBox HorizontalAlignment="Left" Margin="12,47,0,0" Name="TherapiesCombo" VerticalAlignment="Top" Width="92" IsEnabled="True">
            <telerik:RadComboBoxItem Content="smileyface" Name="smileyface" Selected="smileyface_Selected" />
            <telerik:RadComboBoxItem Content="Uturn" Name="Uturn" Selected="Uturn_Selected" />
            <telerik:RadComboBoxItem Content="Item 3" Name="img"/>
        </telerik:RadComboBox>
        <telerik:RadComboBox HorizontalAlignment="Left" Margin="12,196,0,0" Name="CategoriesCombo" VerticalAlignment="Top" Width="92">
            <telerik:RadComboBoxItem Content="Item 1" />
            <telerik:RadComboBoxItem Content="Item 2" />
            <telerik:RadComboBoxItem Content="Item 3" />
        </telerik:RadComboBox>
        <Label Content="Categories" Height="28" HorizontalAlignment="Left" Margin="12,172,0,0" Name="label1" VerticalAlignment="Top" />
        <Label Content="Types of Therapies:" Height="28" HorizontalAlignment="Left" Margin="12,23,0,0" Name="label2" VerticalAlignment="Top" />
        <ScrollViewer CanContentScroll="True" ScrollChanged="ScrollViewer_ScrollChanged" Margin="144,0,0,154">
            <telerik:RadCarousel Name="radCarousel1" Background="Black" Opacity="1">

            </telerik:RadCarousel>

        </ScrollViewer>
        <telerik:RadButton Content="Button" Height="32" HorizontalAlignment="Left" Margin="12,93,0,0" Name="refresh" VerticalAlignment="Top" Width="92" Click="refresh_Click" />
    </Grid>
</Window>

C# Code

namespace WpfApplication2
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        //System.Drawing.Bitmap whypic = WpfApplication2.Properties.Resources.smiley_face_clip_art_20340;
        //bool boollol = false;



        public MainWindow()
        {
            InitializeComponent();

            List<Image> myImages = new List<Image>();
            Image myImage = new Image();
            myImage.Source = new BitmapImage(new Uri("/Images/img-thing.png", UriKind.Relative));
            myImages.Add(myImage);


            Image myImage1 = new Image();
            myImage1.Source = new BitmapImage(new Uri("/Images/clipart_map.gif", UriKind.Relative));
            myImages.Add(myImage1);

            Image myImage2 = new Image();
            myImage2.Source = new BitmapImage(new Uri("/Images/image.png", UriKind.Relative));

            myImages.Add(myImage2);

            Image myImage3 = new Image();
            myImage3.Source = new BitmapImage(new Uri("/Images/smiley_face_clip_art_20340.png", UriKind.Relative));


            myImages.Add(myImage3);

            Image myImage4 = new Image();
            myImage4.Source = new BitmapImage(new Uri("/Images/U-turn_icon.png", UriKind.Relative));

            myImages.Add(myImage4);





            foreach (Image img in myImages)
            {
                this.radCarousel1.ItemsSource = myImages;
            }



            private void radButton1_Click(object sender, RoutedEventArgs e)
        {
            //click and image gone ERROR
            //this.radCarousel1.ItemsSource = new BitmapImage(new Uri("/Images/U-turn_icon.png",UriKind.Relative));

            //Only more next by 1 all the time for each click
            //this.radCarousel1.FindCarouselPanel().MoveBy(1);
            this.radCarousel1.ItemsSource = null;

            List<Image> myImages = new List<Image>();
            Image myImage = new Image();
            myImage.Source = new BitmapImage(new Uri("/Images/img-thing.png", UriKind.Relative));
            myImages.Add(myImage);


            Image myImage1 = new Image();
            myImage1.Source = new BitmapImage(new Uri("/Images/clipart_map.gif", UriKind.Relative));
            myImages.Add(myImage1);

            Image myImage2 = new Image();
            myImage2.Source = new BitmapImage(new Uri("/Images/image.png", UriKind.Relative));

            myImages.Add(myImage2);

            Image myImage3 = new Image();
            myImage3.Source = new BitmapImage(new Uri("/Images/smiley_face_clip_art_20340.png", UriKind.Relative));


            myImages.Add(myImage3);

            Image myImage4 = new Image();
            myImage4.Source = new BitmapImage(new Uri("/Images/U-turn_icon.png", UriKind.Relative));

            myImages.Add(myImage4);

            foreach (Image img in myImages)
            {
                this.radCarousel1.ItemsSource = myImages;
            }

            this.radCarousel1.BringDataItemIntoView(this.radCarousel1.Items[2]);

           }
        private void radButton2_Click(object sender, RoutedEventArgs e)
        {
            this.radCarousel1.ItemsSource = null;

            List<Image> myImages = new List<Image>();
            Image myImage = new Image();
            myImage.Source = new BitmapImage(new Uri("/Images/img-thing.png", UriKind.Relative));
            myImages.Add(myImage);


            Image myImage1 = new Image();
            myImage1.Source = new BitmapImage(new Uri("/Images/clipart_map.gif", UriKind.Relative));
            myImages.Add(myImage1);

            Image myImage2 = new Image();
            myImage2.Source = new BitmapImage(new Uri("/Images/image.png", UriKind.Relative));

            myImages.Add(myImage2);

            Image myImage3 = new Image();
            myImage3.Source = new BitmapImage(new Uri("/Images/smiley_face_clip_art_20340.png", UriKind.Relative));


            myImages.Add(myImage3);

            Image myImage4 = new Image();
            myImage4.Source = new BitmapImage(new Uri("/Images/U-turn_icon.png", UriKind.Relative));

            myImages.Add(myImage4);

            foreach (Image img in myImages)
            {
                this.radCarousel1.ItemsSource = myImages;
            }

            this.radCarousel1.BringDataItemIntoView(this.radCarousel1.Items[2]);

        }

[Maya]

Hi Edwin,

You may use the BringDataItemIntoView(myDataItem) method of the grid. The parameter inside needs to be the item you want to be displayed.

 

Kind regards,
Maya
the Telerik team