如何在較大的圖像頂部按下並通過觸摸清除一個小圖像

Question

想要創建一個有趣的應用程序與照片。這是該方案：

1. 我在頁面大小的照片640X 480（作爲背景）
2. 顯示縮略圖PN左側100x100的

這是我想要的問題解決：

1. 用戶選擇左邊側的縮略圖照片100x100的
2. 用戶按下或點擊在大照片任何地方（640X 480），按下後，它將繪製縮略圖。什麼格式使用Png或Jpg縮略圖，以便在繪製時，縮略圖的背景將是透明的。
3. 用戶可以通過觸摸縮略圖來清除縮略圖。

Answer 1

a）簡單的方法是簡單地處理縮略圖的ManipulationStarted方法並將該縮略圖設置爲當前縮略圖。另外，處理較大照片的ManipulationStarted方法並檢查是否存在current thumbnail。如果是這樣，請將較大照片的圖片來源設置爲縮略圖流的來源。

b）如果您需要透明度，您將不得不使用PNG。如果您不需要透明度，請使用JPG（提高效率）。

c）將縮略圖的圖像源設置爲null以清除它。

編輯 - 這是做你想做的一種方式。當然，您可能想要使用UserControls，而不是單個圖像。

//class level variable that holds your current selected image 
BitmapImage currentBitmap; 

//Create an event handler to know when your page is loaded 
public MyImagePage() 
{ 
    InitializeComponent(); 
    this.Loaded += new RoutedEventHandler(MyImagePage_Loaded); 
} 

//Handle your Page Loaded event 
void MyImagePage_Loaded(object sender, RoutedEventArgs e) 
{ 
//Assign your thumbnail image control a picture 
imgThumbnail.Source = new BitmapImage(new Uri("thumbnail.jpg", UriKind.Relative)); 

//Assign your large photo a default image (without an image, Manipulation methods won't be detected) 
imgLarge.Source = new BitmapImage(new Uri("largeImage.jpg", UriKind.Relative)); 

//Make the current bitmap null 
currentBitmap = null; 
} 

//Handle the ManipulationStarted event for your thumbnail image 
private void imgThumbnail_ManipulationStarted(object sender, ManipulationStartedEventArgs e) 
{ 
    //Set the currentImage to be that of the thumbnail 
    currentImage = (BitmapImage)imgThumbnail.Source; 
} 

//Handle the ManipulationStarted event for your large image 
private void imgLarge_ManipulationStarted(object sender, ManipulationStartedEventArgs e) 
{ 
     //check if the current image is null. If it's not, set the source for the large image 
     //to be that of the current image 
     if (currentImage != null) 
     imgLarge.Source = currentImage; 
} 

這是它背後的基礎知識。您可以創建一個類/ UserControl來代替具有指向圖像較大版本的屬性的縮略圖。然後，您可以將imgLarge源設置爲該圖像較大版本的源。

希望有所幫助。