如何讓圖像在Windows Phone應用程序開發的幻燈片

Question

我建立我的用Visual C＃Windows Phone應用程序的第一個應用2010

• 我想有影像的幻燈片播放的頁面
• 在該幻燈片中，當圖像被點擊時，我想導航到另一個頁面。

我GOOGLE了它，但沒有得到太多的幫助。我試過的是：

void Page1_Loaded(object sender, RoutedEventArgs e) 
{ 
    LoadImages(); 
} 

private void LoadImages() 
{ 
    Image.Add("Image/aaa.jpg"); 
    Image.Add("Image/bbb.jpg"); 
    Image.Add("Image/ccc.jpg"); 
    Image.Add("Image/ddd.jpg"); 
} 

我在頁面的設計頁面寫了這些代碼，我需要幻燈片的圖像。

Answer 1

檢查此示例。

在添加圖片MainPage.xaml中

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"> 
     <Image x:Name="Img" Height="400" Tap="Img_OnTap" ></Image> 
</Grid> 

執行以下操作中MainPage.xaml.cs中

private List<string> _images; 
    /// <summary> 
    /// List of images 
    /// </summary> 
    public List<string> Images 
    { 
     get { return _images; } 
     set { _images = value; } 
    } 

    //selected image index 
    public int SelectedImageIndex { get; set; } 

    // Constructor 
    public MainPage() 
    { 
     InitializeComponent(); 
     this.Loaded += MainPage_Loaded; 
     this.DataContext = this; 
    } 

    void MainPage_Loaded(object sender, RoutedEventArgs e) 
    { 
     LoadImages(); 
     DispatcherTimer t = new DispatcherTimer(); 
     //setting a 5 second interval 
     t.Interval = new TimeSpan(0, 0, 5); 
     t.Tick += t_Tick; 
     t.Start(); 
    } 

    void t_Tick(object sender, EventArgs e) 
    { 
     if (SelectedImageIndex == Images.Count-1) 
      SelectedImageIndex = 0; 
     else 
      SelectedImageIndex++; 

     SetImageSource(Images[SelectedImageIndex]); 
    } 

    //Populating image list 
    private void LoadImages() 
    { 
     if (Images == null) 
      Images = new List<string>(); 
     Images.Add("/Image/aaa.jpg"); 
     Images.Add("/Image/bbb.jpg"); 
     Images.Add("/Image/ccc.jpg"); 
     Images.Add("/Image/ddd.jpg"); 
     SelectedImageIndex = 0; 
     SetImageSource(Images[SelectedImageIndex]); 
    } 

    //setting image source 
    private void SetImageSource(string imagePath) 
    { 
     Img.Source = new BitmapImage(new Uri(imagePath, UriKind.RelativeOrAbsolute)); 
    } 

    //Image tap event 
    private void Img_OnTap(object sender, GestureEventArgs e) 
    { 
     string selectedImagePath = Images[SelectedImageIndex]; 
     //Put your navigation here 
    } 

Answer 2

您可以用定時器和一個列表框創建自己的幻燈片控制試試這個

你的xaml代碼應該是

<ListBox Grid.Row="1" Name="listControlImage" SelectionChanged="listControlImage_SelectionChanged"> 
     <ListBox.ItemTemplate> 
     <DataTemplate> 
     <Image Height="600" Width="460" Stretch="Fill" Source="{Binding}"/> 
    </ListBox.ItemTemplate> 
     </DataTemplate> 

後面的代碼你的代碼應該是

//全局變量

List<BitmapImage> ListImages = new List<BitmapImage>(); 
DispatcherTimer Timer = new DispatcherTimer(); 
int SlideCount=0; 

void Page1_Loaded(object sender, RoutedEventArgs e) 
{ 
    LoadImages(); 
    DisTimer.Tick += DisTimer_Tick; 
    DisTimer.Interval = new TimeSpan(0, 0, 1); 
    DisTimer.Start(); 
} 

private void LoadImages() 
{ 
    ListImages.Add(new BitmapImage(new Uri("/Your project name;component/Image/aaa.jpg", UriKind.Relative))); 
ListImages.Add(new BitmapImage(new Uri("/Your project name;component/Image/bbb.jpg", UriKind.Relative))); 
ListImages.Add(new BitmapImage(new Uri("/Your project name;component/Image/ccc.jpg", UriKind.Relative))); 
ListImages.Add(new BitmapImage(new Uri("/Your project name;component/Image/ddd.jpg", UriKind.Relative))); 

ListImages.ItemsSource =ListImages; 
} 

void DisTimer_Tick(object sender, EventArgs e) 
     { 
if(SlideCount<=3) 
{ 
listControlImage.SelectedIndex = SlideCount; 
SlideCount++; 
} 
else 
    SlideCount=0; 
     } 






private void listControlImage_SelectionChanged_1(object sender, SelectionChangedEventArgs e) 
      { 
if(listControlImage.SelectedIndex ==-1) 
return; 
    //Your Navigation code 
      }