Question

我需要并排放置图片，需要在每张图片下方放置一个小图片图标。请帮我设计一下？任何样品请告诉我..

如何根据条件动态地在一个小图像中放置userimage ..请帮助我..

Answer 1

我为你制作了简单的原型。我无法为你制作整个屏幕。以下是我从您的评论和截图中得到的基本内容。请参阅下面的XAML和截图：

 <ListBox Name="lstImages" VerticalAlignment="Top">
                <ListBox.ItemContainerStyle>
                    <Style TargetType="ListBoxItem">
                        <Setter Property="Padding" Value="0,0,0,-15" />
                        <Setter Property="Margin" Value="2"/>
                    </Style>
                </ListBox.ItemContainerStyle>
                <ListBox.ItemsPanel>
                    <ItemsPanelTemplate>
                        <toolkit:WrapPanel>
                        </toolkit:WrapPanel>
                    </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel>
                            <Image Height="100" Width="110" Source="{Binding BigImageSource}" VerticalAlignment="Top"/>
                            <Image Height="10" Width="10" Source="{Binding SmallImageSource}" VerticalAlignment="Top" HorizontalAlignment="Right" Margin="0,-35,10,0"/>
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>

enter image description here

Answer 2

使用此

<Grid>
  <Grid.ColumnDefinitions>
    <ColumnDefinition/>
    <ColumnDefinition/>   
  </Grid.ColumnDefinitions>
    <Grid Grid.Column="0">
      <Grid.RowDefinitions>
      <RowDefinition/>
      <RowDefinition/>
     </Grid.RowDefinitions>
       <Image Source="Your image" Grid.Row="0"/>
       <Image Source="Your small icon" Grid.Row="1"/>
  </Grid>

<Grid Grid.Column="1">
  <Grid.RowDefinitions>
    <RowDefinition/>
    <RowDefinition/>
  </Grid.RowDefinitions>
   <Image Source="Your image" Grid.Row="0"/>
   <Image Source="Your small icon" Grid.Row="1"/>
</Grid>

</Grid>

Answer 3

<StackPanel>
    <StackPanel Orientation="Horizontal">
      <Image Source="Firstimage" />
      <Image Source="Secondimage" />
    </Stackpanel>
    <StackPanel Orientation="Horizontal">
      <Image Source="Firsticon" />
      <Image Source="Secondicon" />
    </Stackpanel>
</StackPanel>

但是在这里你必须对图标stackpanel进行一些更改，比如设置一些边距，以使其与实际图像对齐。

这只是一种替代方案，您也可以使用网格作为核子的答案

Answer 4

如果要在列表框中显示图像，请在包装面板中以这种方式包装，也可以设置包装方向。 Wrappanel可以在windows phone 7的silverlight工具包中找到。

                         <ListBox Name="lstImages">
                                <ListBox.ItemContainerStyle>
                                    <Style TargetType="ListBoxItem">
                                        <Setter Property="Padding" Value="-15" />
                                        <Setter Property="Margin" Value="0"/>
                                    </Style>
                                </ListBox.ItemContainerStyle>
                                <ListBox.ItemsPanel>
                                    <ItemsPanelTemplate>
                                        <toolkit:WrapPanel>
                                        </toolkit:WrapPanel>
                                    </ItemsPanelTemplate>
                                </ListBox.ItemsPanel>
                                <ListBox.ItemTemplate>
                                    <DataTemplate>
                                  <stackpanel>
                                  <Image Source="Your image" />
                                  <Image Source="Small image" />
                                  </stackpanel>
                                    </DataTemplate>
                                </ListBox.ItemTemplate>
                            </ListBox>

并将此列表框与您的数据集合绑定。

如何在图像中放置图像？

4 个答案: