Microsoft UWP app-设置窗口大小以匹配背景图像

Question

This is probably simple but I cant figure it out (noob to UWP)...

I have an image I want to use as the background for my app (it is really only for desktop - I am not worried about mobile etc).

I just want to set the size of the window so the app starts at a specific size and the image sits in it without scaling.

Make sense?

Should be easy - I have done it in Windows Forms and its pretty straight forward...

I have tried setting the size of the window (same size as image):

ApplicationView.PreferredLaunchViewSize = new Size(Height = 800, Width = 525);

But the image never seems to sit in it properly no matter what settings I adjust - either the image properties or grid size etc??

In XAML design view it all looks OK (to me):

But when you run the app its not:

XAML CODE AS REQUESTED:

<Page
    x:Class="UWP_Test.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:UWP_Test"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid>
        <Image Source="Assets/titlescreen.bmp" Opacity="0.5" VerticalAlignment="Center" HorizontalAlignment="Center"></Image>
    </Grid>
</Page>

XAML.CS code

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.ViewManagement;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409

namespace UWP_Test
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();

            // Set the app window preferred launch view size
            ApplicationView.PreferredLaunchViewSize = new Size(Height = 800, Width = 525);

            // Set app window preferred launch windowing mode
            ApplicationView.PreferredLaunchWindowingMode = ApplicationViewWindowingMode.PreferredLaunchViewSize;


    }

        private void button_Click(object sender, RoutedEventArgs e)
        {
            // move to Start page
            this.Frame.Navigate(typeof(Start));
        }
    }
}

I am sure its simple.

I have added some images

Help me stackoverflow.... You're my only hope...

Answer 1

Though it won't work entirely, why not use the Stretch property set to UniformToFill?

<Grid>
    <Image Source="Assets/titlescreen.bmp" Opacity="0.5" Stretch="UniformToFill"></Image>
</Grid>

Answer 2

You could set ImageBrush for Grid's Background like the following code:

<Grid>
    <Grid.Background>
        <ImageBrush ImageSource="Assets/pander.jpg" Stretch="UniformToFill"></ImageBrush>
    </Grid.Background>
</Grid>

Answer 3

Thanks for all the advice but I found out what was going wrong.

The issue was the brackets in this piece of code I was using to set the window size:

ApplicationView.PreferredLaunchViewSize = new Size(Height = 800, Width = 525);

They needed to be curly braces like this:

ApplicationView.PreferredLaunchViewSize = new Size { Height = 525, Width = 840 };

Once I changed this it is now working fine.

Is it odd that Visual Studio did not highlight these as the wrong sort of braces? The app compiled and ran fine with no errors??

Problem solved

Thanks