Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>Here is what I ended up getting after some toiling:</p> <p>This is the SlicedImage.xaml file: </p> <pre><code> &lt;Rectangle Grid.Row="1" Grid.Column="0" SnapsToDevicePixels="True"&gt; &lt;Rectangle.Fill&gt; &lt;ImageBrush x:Name="CenterLeft" Stretch="Fill" ViewboxUnits="Absolute" AlignmentX="Left" AlignmentY="Center" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; &lt;Rectangle Grid.Row="1" Grid.Column="1" SnapsToDevicePixels="True"&gt; &lt;Rectangle.Fill&gt; &lt;ImageBrush x:Name="CenterCenter" Stretch="Fill" ViewboxUnits="Absolute" AlignmentX="Center" AlignmentY="Center" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; &lt;Rectangle Grid.Row="1" Grid.Column="2" SnapsToDevicePixels="True"&gt; &lt;Rectangle.Fill&gt; &lt;ImageBrush x:Name="CenterRight" Stretch="Fill" ViewboxUnits="Absolute" AlignmentX="Right" AlignmentY="Center" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; &lt;Rectangle Grid.Row="2" Grid.Column="0" SnapsToDevicePixels="True"&gt; &lt;Rectangle.Fill&gt; &lt;ImageBrush x:Name="BottomLeft" Stretch="Fill" ViewboxUnits="Absolute" AlignmentX="Left" AlignmentY="Bottom" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; &lt;Rectangle Grid.Row="2" Grid.Column="1" SnapsToDevicePixels="True"&gt; &lt;Rectangle.Fill&gt; &lt;ImageBrush x:Name="BottomCenter" Stretch="Fill" ViewboxUnits="Absolute" AlignmentX="Center" AlignmentY="Bottom" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; &lt;Rectangle Grid.Row="2" Grid.Column="2" SnapsToDevicePixels="True"&gt; &lt;Rectangle.Fill&gt; &lt;ImageBrush x:Name="BottomRight" Stretch="Fill" ViewboxUnits="Absolute" AlignmentX="Right" AlignmentY="Bottom" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; &lt;/Grid&gt; &lt;/UserControl&gt; </code></pre> <p>And the SlicedImage.xaml.vb for those who want this in VB.Net:</p> <pre><code>Partial Public Class SlicedImage Public imageSource As ImageSource Public sliceTop As Double Public sliceRight As Double Public sliceLeft As Double Public sliceBottom As Double Public Sub New() InitializeComponent() End Sub Public Sub SetViewboxes() Dim RealHeight As Double = TopLeft.ImageSource.Height Dim RealWidth As Double = TopLeft.ImageSource.Width ColumnLeft.Width = New GridLength(sliceLeft) ColumnRight.Width = New GridLength(RealWidth - sliceRight) RowTop.Height = New GridLength(sliceTop) RowBottom.Height = New GridLength(RealHeight - sliceBottom) TopLeft.Viewbox = New Rect(0, 0, sliceLeft, sliceTop) TopCenter.Viewbox = New Rect(sliceLeft, 0, sliceRight - sliceLeft, sliceTop) TopRight.Viewbox = New Rect(sliceRight, 0, RealWidth - sliceRight, sliceTop) CenterLeft.Viewbox = New Rect(0, sliceTop, sliceLeft, sliceBottom - sliceTop) CenterCenter.Viewbox = New Rect(sliceLeft, sliceTop, sliceRight - sliceLeft, sliceBottom - sliceTop) CenterRight.Viewbox = New Rect(sliceRight, sliceTop, RealWidth - sliceRight, sliceBottom - sliceTop) BottomLeft.Viewbox = New Rect(0, sliceBottom, sliceLeft, RealHeight - sliceBottom) BottomCenter.Viewbox = New Rect(sliceLeft, sliceBottom, sliceRight - sliceLeft, RealHeight - sliceBottom) BottomRight.Viewbox = New Rect(sliceRight, sliceBottom, RealWidth - sliceRight, RealHeight - sliceBottom) End Sub Public Property ImageLocation() As ImageSource Get Return Nothing End Get Set(ByVal value As ImageSource) TopLeft.ImageSource = value TopCenter.ImageSource = value TopRight.ImageSource = value CenterLeft.ImageSource = value CenterCenter.ImageSource = value CenterRight.ImageSource = value BottomLeft.ImageSource = value BottomCenter.ImageSource = value BottomRight.ImageSource = value End Set End Property Public Property Slices() As String Get Return Nothing End Get Set(ByVal value As String) Dim sliceArray As Array = value.Split(" ") sliceTop = sliceArray(0) sliceRight = sliceArray(1) sliceBottom = sliceArray(2) sliceLeft = sliceArray(3) SetViewboxes() End Set End Property End Class </code></pre> <p>The User Control would be used like this:</p> <pre><code>&lt;my:SlicedImage ImageLocation="Images/left_bubble.png" Slices="18 25 19 24" /&gt; </code></pre> <p>where ImageLocation is the image location, and Slices is "top right bottom left" for how the image should be sliced. All dimensions should be based from the top left corner.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload