2010-02-04 13 views
11

हमारे पास एक ऐसी छवि है जहां हम दृश्य बॉक्स निर्देशांक बनाते हैं जो कि हमारे आवेदन में अलग-अलग छवियों के चित्र देखने के लिए सेट की गई छवि के भीतर पूर्ण/नीचे दाएं बिंदु हैं। डब्ल्यूपीएफ में, हम छवि को कैसे लोड करते हैं, और उस छवि के भीतर पूर्ण/नीचे दाएं बिंदुओं के साथ, केवल उस दृश्य बॉक्स के भीतर छवि का हिस्सा दिखाएं?डब्ल्यूपीएफ में, एक छवि के एक हिस्से को देखें

उत्तर

14

आप एक CroppedBitmap के साथ ऐसा कर सकते हैं:

<Image> 
    <Image.Source> 
    <CroppedBitmap Source="<path to source image>" SourceRect="20,20,50,50"/> 
    </Image.Source> 
</Image> 

इस स्थिति से शुरू छवि के 50x50 क्षेत्र प्रदर्शित करेगा (20,20)

0

मुझे ऐसा लगता है कि आप छवि बना सकते हैं नीचे दिखाए गए व्यूबॉक्स के एक हिस्से को नियंत्रित करें:

<Viewbox Name="vBox" Stretch="None" HorizontalAlignment="Left" 
VerticalAlignment="Top" Height="50" Width="50"> 
<Image Name="ClippedImage" 
Source="{Binding NotifyOnSourceUpdated=True, NotifyOnTargetUpdated=True}" 
Stretch="None" /> 
</Viewbox> 

यह आपको एक व्यू बॉक्स 50x50 देगा। जाहिर है आप अपनी आवश्यकताओं के अनुरूप ऊंचाई और चौड़ाई बदल सकते हैं। मैं छोटे व्यूबॉक्स के चारों ओर पैन करने के लिए स्क्रॉलव्यूअर का उपयोग करता हूं।

1

एक क्लिप के साथ एक RenderTransform का उपयोग करना, और भी बेहतर काम करता है क्योंकि CroppedBitmap थोड़े अपरिवर्तनीय है:,

<Image x:Name="MyImage"> 
    <Image.RenderTransform> 
     <TranslateTransform X="-100" Y="-100" /> 
    </Image.RenderTransform> 
    <Image.Clip> 
     <RectangleGeometry Rect="0 0 250 250" /> 
    </Image.Clip> 
</Image> 

यह एक की (150 150,) आकार वाले ऑफसेट पर छवि (100, 100) को प्रदर्शित करेगा इसलिए मत भूलना कि Rect में स्टार्टऑफसेट शामिल होना चाहिए।

यहाँ कोड में यह गणना करने के लिए एक विधि है:

public static void ClipImage(System.Windows.Controls.Image image, Rect visibleRect) 
{ 
    image.RenderTransform = new TranslateTransform(-visibleRect.X, -visibleRect.Y); 
    image.Clip = new RectangleGeometry 
    { 
     Rect = new Rect(
      0, 
      0, 
      visibleRect.X + visibleRect.Width, 
      visibleRect.Y + visibleRect.Height) 
    }; 
} 
संबंधित मुद्दे