Win10 app - Rounded corner images that maintain aspect ratio
A simple application that simply displays a list of images. The image list must contain the aspect ratio, but be the full width of the window + field bits. The hard part makes the images additionally rounded corners.
Ideas?
Only success I've had with ImageBrush, but any control using that doesn't support aspect ratio. For example, here you have to set the height and width.
<Rectangle RadiusX="10" RadiusY="10" Stretch="Fill" Width="100" Height="100" >
<Rectangle.Fill>
<ImageBrush ImageSource="{Binding}"></ImageBrush>
</Rectangle.Fill>
</Rectangle>
full source here: http://1drv.ms/1HlZHVe
source to share
I got nicely rounded corners on my images (in my UWP app) using ImageBrush, however be careful if you do it programmatically - the first time I used my memory pretty badly and was consuming too much (bad coding).
I used ImageBrush the way you think it is, but I didn't distort the aspect ratio; make sure you set properties like Stretch accordingly. Stretch.UniformToFill
...
<Rectangle x:Name="rctCardFace" Margin="0" RadiusX="20" RadiusY="20" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<Rectangle.Fill>
<ImageBrush Stretch="UniformToFill"/>
</Rectangle.Fill>
</Rectangle>
Or in C #
Uri path = new Uri(_ActiveStyle.BackgroundImagePath, UriKind.Absolute);
BitmapImage bitmapImage = new BitmapImage(path);
if (_AppReference.CardManager.TempImgBrush == null)
{
_AppReference.CardManager.TempImgBrush = new ImageBrush();
}
_AppReference.CardManager.TempImgBrush.ImageSource = bitmapImage;
_AppReference.CardManager.TempImgBrush.Stretch = _ActiveStyle.BackgroundImageStretch;
_AppReference.CardManager.TempImgBrush.AlignmentX = _ActiveStyle.BackgroundImageAlignX;
_AppReference.CardManager.TempImgBrush.AlignmentY = _ActiveStyle.BackgroundImageAlignY;
cfPreview.ImgB = _AppReference.CardManager.TempImgBrush;
source to share