سؤال

I have the below code. I am trying to place the image directly to the right of the textblock within the border, but the image is almost touching the right side of the screen. How can I allign the image to the right of the textblock

<Border BorderBrush="#FFD6D4D4" BorderThickness="0,0,0,1" Grid.Column="0" Grid.Row="1"
        Height="28" VerticalAlignment="Top" Background="#FFF7F7F7"
        HorizontalAlignment="Stretch">
                <DockPanel LastChildFill="False">
                    <TextBlock DockPanel.Dock="Left" 
                               Style="{StaticResource HeaderTextBlockStyle}" 
                               Text="Check new items"
                               VerticalAlignment="Center" Margin="2" />
                    <Image
                       DockPanel.Dock="Left"
                       VerticalAlignment="Center"                      
                       SnapsToDevicePixels="True"
                       UseLayoutRounding="True"
                       RenderOptions.BitmapScalingMode="HighQuality"
                       Source="/Media/pointer.png"
                       RenderTransformOrigin="0.95,4.046" 
                       HorizontalAlignment="Center" Margin="0"  
                       Height="25.306" Width="25.008>
                        <Image.RenderTransform>
                            <TransformGroup>
                                <ScaleTransform/>
                                <SkewTransform/>
                                <RotateTransform Angle="49.57"/>
                                <TranslateTransform X="-39.746" Y="-21.185"/>
                            </TransformGroup>
                        </Image.RenderTransform>
                    </Image>                  
                </DockPanel>
            </Border>
هل كانت مفيدة؟

المحلول

   Try using the Grid control and define two columns into it

    <Border BorderBrush="#FFD6D4D4" BorderThickness="0,0,0,1" Grid.Column="0" Grid.Row="1"
            Height="28" VerticalAlignment="Top" Background="#FFF7F7F7"
            HorizontalAlignment="Stretch">
                    <Grid>
<Grid.ColumnDefinitions>
     <Column Definition Width="*"/>
     <Column Definition Width="*"/>
 </Grid.ColumnDefinitions>

                        <TextBlock Grid.Column="0"                                   Style="{StaticResource HeaderTextBlockStyle}" 
                                   Text="Check new items"
                                   VerticalAlignment="Center" Margin="2" />
                        <Image
                           Grid.Column="1"                               VerticalAlignment="Center"                      
                           SnapsToDevicePixels="True"
                           UseLayoutRounding="True"
                           RenderOptions.BitmapScalingMode="HighQuality"
                           Source="/Media/pointer.png"
                           RenderTransformOrigin="0.95,4.046" 
                           HorizontalAlignment="Center" Margin="0"  
                           Height="25.306" Width="25.008>
                            <Image.RenderTransform>
                                <TransformGroup>
                                    <ScaleTransform/>
                                    <SkewTransform/>
                                    <RotateTransform Angle="49.57"/>
                                    <TranslateTransform X="-39.746" Y="-21.185"/>
                                </TransformGroup>
                            </Image.RenderTransform>
                        </Image>                  
                    </Grid>
            </Border>

نصائح أخرى

Try using a StackPanel with Orientation set to horizontal instead of the dockpanel. That should put the image right next to the textblock.

if you still want to use the dock panel try setting the margin you want, on the image like margin="0,0,100,0"

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top