Develop Reference

How to remove white place in UWP App (XAML)

I need to remove this white borders (marked orange pen). I want that my App fit 880px and be full width. In My XAML Document I did next
<Page
x:Class="FirstScreen.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:FirstScreen"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" Width="880" Height="600">
<Grid Width="880" Height="600" Background="Black">
</Grid>
</Page>
But I still have white borders! what I need that my App will compile with out this borders?

You can stop window resize, by using TryResizeView(Size) function, but its not recommended to do resize by code behind, when user is engaged in UI.
I will share the solution here , but again ITS NOT RECOMENDED.
in App.xaml.cs , OnLaunched event , once all your UI related code completed, at the end , place this line of code
ApplicationView.GetForCurrentView().TryResizeView(size);
ApplicationView.GetForCurrentView().VisibleBoundsChanged += App_VisibleBoundsChanged;
and create event for "App_VisibleBoundsChanged"
private void App_VisibleBoundsChanged(ApplicationView sender, object args)
{
ApplicationView.GetForCurrentView().TryResizeView(size);
}
declare a global variable for Size
Size size = new Size(800, 600);
This will make your app, always work in specified size. But the user feels like a glitch in app, when they try to resize .
Here is the entire App.xaml.cs code
sealed partial class App : Application
{
Size size = new Size(800, 600);
/// <summary>
/// Initializes the singleton application object. This is the first line of authored code
/// executed, and as such is the logical equivalent of main() or WinMain().
/// </summary>
public App()
{
this.InitializeComponent();
}
/// <summary>
/// Invoked when the application is launched normally by the end user. Other entry points
/// will be used such as when the application is launched to open a specific file.
/// </summary>
/// <param name="e">Details about the launch request and process.</param>
protected override void OnLaunched(LaunchActivatedEventArgs e)
{
Frame rootFrame = Window.Current.Content as Frame;
// Do not repeat app initialization when the Window already has content,
// just ensure that the window is active
if (rootFrame == null)
{
// Create a Frame to act as the navigation context and navigate to the first page
rootFrame = new Frame();
if (e.PreviousExecutionState == ApplicationExecutionState.Terminated)
{
//TODO: Load state from previously suspended application
}
// Place the frame in the current Window
Window.Current.Content = rootFrame;
}
if (e.PrelaunchActivated == false)
{
if (rootFrame.Content == null)
{
// When the navigation stack isn't restored navigate to the first page,
// configuring the new page by passing required information as a navigation
// parameter
rootFrame.Navigate(typeof(MainPage), e.Arguments);
}
// Ensure the current window is active
Window.Current.Activate();
}
ApplicationView.GetForCurrentView().TryResizeView(size);
ApplicationView.GetForCurrentView().VisibleBoundsChanged += App_VisibleBoundsChanged;
}
private void App_VisibleBoundsChanged(ApplicationView sender, object args)
{
ApplicationView.GetForCurrentView().TryResizeView(size);
}
}

You are giving the Grid a width as 880, so the Grid is not fill in all the window. Just remove the width and height that you've added.

Specify startup monitor for UWP app

In a UWP desktop app , is there a way to force the application to open on a specific monitor. (in my case I have a laptop and extra screen connected to the laptop, so I want the specify the startup screen in code)
I used the following code in winforms:
Screen[] screens = Screen.AllScreens;
if (Screen.AllScreens.Length == 1)
{
Application.Run(new frmMain());
}
else
{
//select largest monitor and set new monitor
Rectangle bounds = screens[LargestScreen].Bounds;
frm.SetBounds(bounds.X, bounds.Y, bounds.Width, bounds.Height);
frm.StartPosition = FormStartPosition.Manual;
Application.Run(frm);
}
Any idea how to implement the above in a UWP app?

You should be able to create multiple views for the app and use ProjectionManager class with method StartProjectingAsync to show the secondary view on another screen. You may do this in OnLaunched method then once the app launch the secondary view will show on the screen you want.
protected override async void OnLaunched(LaunchActivatedEventArgs e)
{
if (System.Diagnostics.Debugger.IsAttached)
{
this.DebugSettings.EnableFrameRateCounter = true;
}
Frame rootFrame = Window.Current.Content as Frame;
if (rootFrame == null)
{
// Create a Frame to act as the navigation context and navigate to the first page
rootFrame = new Frame();
rootFrame.NavigationFailed += OnNavigationFailed;
if (e.PreviousExecutionState == ApplicationExecutionState.Terminated)
{
//TODO: Load state from previously suspended application
}
// Place the frame in the current Window
Window.Current.Content = rootFrame;
}
///Get all the screens.
String projectorSelectorQuery = ProjectionManager.GetDeviceSelector();
var outputDevices = await DeviceInformation.FindAllAsync(projectorSelectorQuery);
//if(outputDevices.Count==1)
//{
//}
int thisViewId;
int newViewId = 0;
///Choose one screen for display .
DeviceInformation showDevice = outputDevices[1];
thisViewId = ApplicationView.GetForCurrentView().Id;
if (e.PrelaunchActivated == false)
{
if (rootFrame.Content == null)
{
}
Window.Current.Activate();
}
///Create a new view
await CoreApplication.CreateNewView().Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () =>
{
Frame frame = new Frame();
frame.Navigate(typeof(MainPage), null);
Window.Current.Content = frame;
Window.Current.Activate();
newViewId = ApplicationView.GetForCurrentView().Id;
});
await ProjectionManager.StartProjectingAsync(newViewId, thisViewId, showDevice);
}
But it seems like the first view cannot be directly show on other screens since the StartProjectingAsync method requires a new view id. The first view that’s created when your app starts is called the main view. You don’t create this view; it’s created by the app. The main view's thread serves as the manager for the app, and all app activation events are delivered on this thread. And the main view cannot be closed, so the main first view will still leave on the first screen.
Details please reference the Projection official sample.

How to properly display a splash screen

I want to display a splash screen in my app since I have to read some data on disk and customize the interface accordingly. If I didn't the effect would be that the interface is loaded and then customized, and the effect is clearly visible. So my idea is define a globla splash screen window and:
In the constructor.
WindowState = WindowState.Minimized; // <---- for the mainWindow
splashScreen.Show();
in the WindowViewBase_Loaded event
SetInterfaceElements(); // <-------interface customization (1)
splashScreen.Close();
WindowState = WindowState.Maximized; // (2)
Activate(); // <------------------------to put focus on
In the end the effect is always the same so a gap between (1) and (2).
So I thought about a refresh problem. I tried to force it with UpdateLayout but no luck. So from here another solution but always the same. Am I missing something??

What you need to do is to create a splash screen class and encapsulate all of its functions. Furthermore, you need to activate the splash screen through a thread, like this:
public static class SplashScreenView
{
public static Show()
{
Thread thread = new Thread(() =>
{
splashScreenView = new SplashScreenView();
....
}
// you code
thread.Start();
}
public static Close()
{
// close splash screen code
}
}
After that your code suppose to be like that:
SplashScreenView.Show();
// all your code
SplashScreenView.Close();
This way you don't need to maximize and minimize your window.

In the mainView constructor
public MainView()
{
SplashScreen splashScreen = new SplashScreen();
splashScreen.Show();
...
}
Then
Action emptyDelegate = delegate { };
bool IsContentRendered = false;
private void WindowViewBase_Loaded(object sender, RoutedEventArgs e)
{
SetInterfaceElements();
Dispatcher.Invoke(emptyDelegate, DispatcherPriority.Render);<---to refresh
IsContentRendered = true;
}
finally
private void WindowViewBase_ContentRendered(object sender, EventArgs e)
{
if (IsContentRendered)
{
if (splashScreen != null)
splashScreen.Close();
WindowState = WindowState.Maximized;
Activate();
}
}

Personally i would go with setting the Splash as the MainWindow on application initialization, doing the required loading in the loaded callback of the splash window and then opening + changing the actual MainWindow. That way you don't have to bother with threads/ui freezes.

Can't make Share works

i'm using the Intense template to make a UWP application, the problem is that i can't make the Share works, cause i don't know how to navigate from the app.xaml.cs with this template.
protected override async void OnShareTargetActivated(ShareTargetActivatedEventArgs args)
{
ShareOperation shareOperation = args.ShareOperation;
//Can't make any navigation
}

You can get Microsoft source code to retrieve Frame object
private Frame CreateRootFrame()
{
Frame rootFrame = Window.Current.Content as Frame;
// Do not repeat app initialization when the Window already has content,
// just ensure that the window is active
if (rootFrame == null)
{
// Create a Frame to act as the navigation context and navigate to the first page
rootFrame = new Frame();
// Place the frame in the current Window
Window.Current.Content = rootFrame;
}
return rootFrame;
}
and use like you want
protected override void OnShareTargetActivated(ShareTargetActivatedEventArgs args)
{
var rootFrame = CreateRootFrame();
// your page and share operation as navigation parameters
rootFrame.Navigate(typeof(ShareTargetPage), args.ShareOperation);
Window.Current.Activate();
}
Microsoft Sample Project

Default SplashScreen showing before Extended SplashScreen

Im trying to add a custom splashscreen on my windows 8 store app
I managed to get it to work, but the default SplashScreen still appears before my Custom one.
This is my SplashScreen XAML:
<Page
x:Class="CartuxaTablet.ExtendedSplash"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:CartuxaTablet"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="#FF0000">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition Height="180"/>
</Grid.RowDefinitions>
<Canvas Grid.Row="0">
<Image x:Name="extendedSplashImage" Source="ms-appx:///Assets/splash.png" Canvas.Left="158" Canvas.Top="48" />
</Canvas>
<StackPanel Grid.Row="1" HorizontalAlignment="Center">
<ProgressRing IsActive="True"></ProgressRing>
</StackPanel>
</Grid>
and the code behind:
namespace CartuxaTablet
{
/// <summary>
/// An empty page that can be used on its own or navigated to within a Frame.
/// </summary>
partial class ExtendedSplash
{
internal Rect splashImageRect; // Rect to store splash screen image coordinates.
internal bool dismissed = false; // Variable to track splash screen dismissal status.
internal Frame rootFrame;
private SplashScreen splash; // Variable to hold the splash screen object.
public ExtendedSplash(SplashScreen splashscreen, bool loadState)
{
InitializeComponent();
// Listen for window resize events to reposition the extended splash screen image accordingly.
// This is important to ensure that the extended splash screen is formatted properly in response to snapping, unsnapping, rotation, etc...
Window.Current.SizeChanged += new WindowSizeChangedEventHandler(ExtendedSplash_OnResize);
splash = splashscreen;
if (splash != null)
{
// Register an event handler to be executed when the splash screen has been dismissed.
splash.Dismissed += new TypedEventHandler<SplashScreen, Object>(DismissedEventHandler);
// Retrieve the window coordinates of the splash screen image.
splashImageRect = splash.ImageLocation;
PositionImage();
}
// Create a Frame to act as the navigation context
rootFrame = new Frame();
// Restore the saved session state if necessary
RestoreStateAsync(loadState);
}
async void RestoreStateAsync(bool loadState)
{
if (loadState)
await SuspensionManager.RestoreAsync();
// Normally you should start the time consuming task asynchronously here and
// dismiss the extended splash screen in the completed handler of that task
// This sample dismisses extended splash screen in the handler for "Learn More" button for demonstration
}
// Position the extended splash screen image in the same location as the system splash screen image.
void PositionImage()
{
extendedSplashImage.SetValue(Canvas.LeftProperty, splashImageRect.X);
extendedSplashImage.SetValue(Canvas.TopProperty, splashImageRect.Y);
extendedSplashImage.Height = splashImageRect.Height;
extendedSplashImage.Width = splashImageRect.Width;
}
void ExtendedSplash_OnResize(Object sender, WindowSizeChangedEventArgs e)
{
// Safely update the extended splash screen image coordinates. This function will be fired in response to snapping, unsnapping, rotation, etc...
if (splash != null)
{
// Update the coordinates of the splash screen image.
splashImageRect = splash.ImageLocation;
PositionImage();
}
}
// Include code to be executed when the system has transitioned from the splash screen to the extended splash screen (application's first view).
void DismissedEventHandler(SplashScreen sender, object e)
{
dismissed = true;
// Navigate away from the app's extended splash screen after completing setup operations here...
// This sample navigates away from the extended splash screen when the "Learn More" button is clicked.
}
}
}
and on my App.Xaml.cs i added this.
if (e.PreviousExecutionState != ApplicationExecutionState.Running)
{
bool loadState = (e.PreviousExecutionState == ApplicationExecutionState.Terminated);
ExtendedSplash extendedSplash = new ExtendedSplash(e.SplashScreen, loadState);
Window.Current.Content = extendedSplash;
}
Window.Current.Activate();
Do i need to do something extra to disable the default Splash Screen?

You can't disable the default splash screen, but you can work with it to customize it. You can see the Guidelines for splash screens (Windows Store apps).