怎么样能够用IMAGE控件显示图片中的某个区域？

Question

用法类似imagelist，现在图片列表中的某一个图片来显示

Answer 1

你好，

你的意思是选择多个图片中的一个来显示么？

方法有很多种，性能也不一样，具体可以参考MSDN的Blog：

Image Tips for Windows Phone 7

---

Keep Fighting

Answer 2

不是的，是一张大的图片比如说有400*400大小，我想现实其中的一部分，比如说（100，100,200,200）这个区域的图像，应该怎么做？

Answer 3

你好,

如果你要这么处理的话,估计要你一个一个像素的移动.

同时,从个人角度,我建议你尝试http://writeablebitmapex.codeplex.com/

            WriteableBitmap writeableBitmap = new WriteableBitmap(0, 0).FromResource("Otomii Lu.jpg");
            var croppedWriteableBitmap = writeableBitmap.Crop(100, 100, 200, 200);
            image1.Source = croppedWriteableBitmap;

以上代码就可以解决问题

Answer 4

你好今天又发现一个问题，当一个图片太长的时候，一个image没有办法显示完整，我想把它用多个IMAGE显示出来，代码如下

：

            WriteableBitmap writeableBitmap = new WriteableBitmap(0, 0).FromResource("/Images/2.jpg");
            image1.Source = writeableBitmap.Crop(0, 0, 500, 500);
            writeableBitmap.Invalidate();
//             Image img1 = new Image();
//             img1.Source = writeableBitmap.Crop(0, 0, 500, 500);
//             stackpanel1.Children.Add(img1);

//             WriteableBitmap writeableBitmap1 = new WriteableBitmap(0, 0).FromResource("/Images/2.jpg");

            Image img = new Image();
            img.Source = writeableBitmap.Crop(0, 500, 500, 1000);
            writeableBitmap.Invalidate();

            stackpanel1.Children.Add(img);

但是图片显示不出来，请问是什么原因

Answer 5

你好,

你的Image没有设置长宽吧

Answer 6

        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <ScrollViewer Name="scviewer1">
                <StackPanel Name="stackpanel1">
                    <Image Name="image1" ImageFailed="image1_ImageFailed" ImageOpened="image1_ImageOpened" />
                    <Image Name="image2" ImageFailed="image1_ImageFailed" ImageOpened="image1_ImageOpened" />
                    <Image Name="image3" ImageFailed="image1_ImageFailed" ImageOpened="image1_ImageOpened" />
                </StackPanel>
            </ScrollViewer>
        </Grid>

        private void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
        {
            WriteableBitmap writeableBitmap = new WriteableBitmap(0, 0).FromResource("/Images/2.jpg");


            image1.Source = writeableBitmap.Crop(0, 0, 500, 500);
            writeableBitmap.Invalidate();
            image2.Source = writeableBitmap.Crop(0, 500, 500, 500);
            writeableBitmap.Invalidate();

            image3.Source = writeableBitmap.Crop(0, 1000, 500, 500);
            writeableBitmap.Invalidate();

        }

上面是我的代码，我的三个image控件是放在stackpanel里面的，宽度和strech都是默认的，但是图片显示不出来。

奇怪的是，如果我只显示第一个和第三个图片，或者第二个和第三个图片是可以的，但是第一个和第二个放在一起显示就不行，就什么都出不来。

Answer 7

你好我测试了你的代码,发现在我这里是运行正常的:

        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Image Height="100" HorizontalAlignment="Left" Margin="10,10,0,0" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="100" />
            <Image Height="100" HorizontalAlignment="Left" Margin="10,170,0,0" Name="image2" Stretch="Fill" VerticalAlignment="Top" Width="100" />
            <Image Height="100" HorizontalAlignment="Left" Margin="10,330,0,0" Name="image3" Stretch="Fill" VerticalAlignment="Top" Width="100" />
        </Grid>

        public MainPage()
        {
            InitializeComponent();
            WriteableBitmap writeableBitmap = new WriteableBitmap(0, 0).FromResource("Otomii Lu.jpg");
            image1.Source = writeableBitmap.Crop(0, 0, 100, 100);
            writeableBitmap.Invalidate();
            image2.Source = writeableBitmap.Crop(0, 100, 100, 100);
            writeableBitmap.Invalidate();
            image3.Source = writeableBitmap.Crop(100, 100, 100, 100);
            writeableBitmap.Invalidate();
        }

建议把代码放到InitializeComponent()后面进行尝试.

同时设定Image的大小为500*500.

或者为不同的image创建不同的WriteableBitmap,类似于:

            WriteableBitmap writeableBitmap1 = new WriteableBitmap(0, 0).FromResource("Otomii Lu.jpg");
            image1.Source = writeableBitmap1.Crop(0, 0, 100, 100);
            WriteableBitmap writeableBitmap2 = new WriteableBitmap(0, 0).FromResource("Otomii Lu.jpg");
            image2.Source = writeableBitmap2.Crop(0, 100, 100, 100);
            WriteableBitmap writeableBitmap3 = new WriteableBitmap(0, 0).FromResource("Otomii Lu.jpg");
            image3.Source = writeableBitmap3.Crop(100, 100, 100, 100);