microsoft/uwp-experiences

Universal Windows Platform (UWP) samples and showcases

UWP Experiences - app samples

The UWP App Experiences are beautiful, cross device, feature rich and functional app samples built to demonstrate realistic app scenarios on the UWP platform across desktop, Xbox, mobile, and more. Besides being open source on GitHub, each sample is published to the Windows Store for easier access for developers and each is accompanied with at least one blog post and short overview video.

About the samples

While these samples were initially created for the App Dev on Xbox live event and blog series, they have been built and designed for multiple UWP devices and scenarios in mind from the start. In fact, all samples have been developed to work on Desktop, Mobile, and Xbox One. Any developer can take advantage of these samples regardless of the device type or features they are targeting, and we are looking forward to hearing about your experience.

Downloading individual samples

All samples are located in the apps folder. However, we realize that you might want to only download a single sample to try it out so there is also a seperate branch for each sample that only contains relevant files. Switch to appropriate branch in the uper left corner and then click on Clone or download in the upper right corner to download the sample.

Experiences

The News Experience

code | blog post | video ---|---|---|---

Features:	Per device tailored UI	Gamepad	Focus	TV Layout

Fourth Coffee is a news app that works across the desktop, phone, and Xbox One and offers a premium experience that takes advantage of each device’s strengths.

---

The Weather Experience

code | blog post | video ---|---|---|---

Features:	Unity and XAML interop	App Services	App Extensions

Atmosphere is a weather app that showcases the use of the popular Unity Engine to build beautiful UWP apps.In addition, the app implements UWP app extensions to enable other developers to extend certain areas of the app and it exposes an app service that enables other apps to use that weather information, as illustrated by Fourth Coffee.

---

The Music Experience

code | blog post | video ---|---|---|---

Features:	Sharing code with Xamarin (UWP and tvOS)	Background Audio	SignalR

Backdrop is a cross platform music app sharing code between UWP and tvOS using Xamarin. It supports background audio on UWP devices and cross platform device collaboration using SignalR.

---

The Video Experience

code | blog post | video ---|---|---|---

Features: | Hosted Web App | Controller support | Media Transport Controls Integration ---|---|---|---|---

South Ridge Video is a hosted web application built with React.js, and hosted on a web server. The app can easily be converted to a UWP application that takes advantage of native platform capabilities and can be distributed through the Windows Store as any other UWP app.

---

The IoT Experience

code | blog post | video ---|---|---|---

Features:	Windows IoT Core	Azure IoT Hub	Azure Event Hub	Azure Stream Analytics

Best For You is a fitness UWP app focused on collecting data from a fictional IoT enabled yoga clothes and uses Windows IoT Core, Azure IoT Hub, Azure Event Hub and Azure Stream Analytics for processing.

---

The Social Experience

code | blog post 1 | video 1 | blog post 2 | video 2 | blog post 3 | video 3 ---|---|---|---|---|---|---|---

Features:	Camera Integration	Cognitive Services Vision, Face, and Speech APIs	Project Rome	Social Network integration	Speech	Inking

Adventure Works is a cross device UWP application for sharing adventures and experiences with fictional friends.

uwp-experiences's Issues

Unhandled exceoption

first, my OOBE was a bit weird, especially around signin (I finally opted for Skip sign in. the second odd experience was when I tried to add an adventure. when I was using the camera, I threw an exception that wasn't very helpful:

adventureworks exception.txt

and ever since, I've been unable to add an adventure. can you at least tell me where I can find *The configuration data for this product" so I can uncorrupt it (whatever that means)?

Weather App, Contain Example for Communication from Unity to UWP Project?

Hi, I have both little experience of C# and Unity,
want to see any possibilities for Unity project's 3D rendering layer to communicate to 2D XAML UI?

If that possible, direction or better example to showcase it.

Problem adding a IBasicVideoEffect

Hi,
First of all, nice project.

I added a Windows Runtime Component (UWP) project to this solution and within this I added a class GrayscaleVideoEffect.cs which has the following code

public sealed class GrayscaleVideoEffect : IBasicVideoEffect
{
    CanvasDevice canvasDevice;

    public void SetEncodingProperties(VideoEncodingProperties encodingProperties, IDirect3DDevice device)
    {
        if (device != null)
        {
            canvasDevice = CanvasDevice.CreateFromDirect3D11Device(device);
        }
        else
        {
            canvasDevice = CanvasDevice.GetSharedDevice(false);
        }
    }

    public void ProcessFrame(ProcessVideoFrameContext context)
    {
        var inputSurface = context.InputFrame.Direct3DSurface;
        var outputSurface = context.OutputFrame.Direct3DSurface;

        if ((inputSurface == null) || (outputSurface == null))
            return;

        using (var inputBitmap = CanvasBitmap.CreateFromDirect3D11Surface(canvasDevice, inputSurface))
        using (var renderTarget = CanvasRenderTarget.CreateFromDirect3D11Surface(canvasDevice, outputSurface))
        using (var ds = renderTarget.CreateDrawingSession())
        {
            var grayscale = new GrayscaleEffect() { Source = inputBitmap };
            ds.DrawImage(grayscale);
        }
    }

    public void SetProperties(IPropertySet configuration)
    {

    }

    public void Close(MediaEffectClosedReason reason)
    {
        canvasDevice?.Dispose();
    }

    public void DiscardQueuedFrames()
    {

    }

    public bool IsReadOnly => false;

    public IReadOnlyList<VideoEncodingProperties> SupportedEncodingProperties => new List<VideoEncodingProperties>();

    public MediaMemoryTypes SupportedMemoryTypes => MediaMemoryTypes.Gpu;

    public bool TimeIndependent => true;
}

After adding a reference to this project in the AdventureWorks project, I added the following line in the Camera.cs file just before await _mediaCapture.StartPreviewAsync();

await _mediaCapture.AddVideoEffectAsync(new VideoEffectDefinition(typeof(GrayscaleVideoEffect).FullName), MediaStreamType.VideoPreview);

Upon running the app, I get the following exception

How do I fix this error?

Quick Pinch gesture on the canvas causes Stroke creation

The gesture is not always recognised and touch is taken instead of quick pinch, which causes stroke creation on the canvas.
Refer the video of Paint 3D application: -
https://cl.ly/f048de28e322

Project Rome not working !

Hi, first of all, thank you to bring us this interesting samples !

So, for the app Adventure Works, it's look like remote app service not working on Creators Update !

I have tried on same device with an windows phone emulator: not working.

I know that because before Creators Update, when I was playing with this sample, devices were listed and when you selected one, you can remotely use slideshow or all stuff made with this app.

I am trying to guess what is the problem, maybe this sample work good only on Anniversary Update ! Because if I take the sample RemoteSystems from "Windows-universal-samples" github, it's work without problems.

Bye.

UWP is bad

In windows 10 we finally recieved definition of svchost processes. But now we have ambiguous "Runtime Broker" processes.
Single profile, single system, no recovery. I had to redownload the same game nearly 10 times, because it either decided to stop working, or because I decided to do a clean install because Windows 10 is broken and MS technical support's only useful suggestion is that.
UWP fails to install apps all the time with ambiguous errors where MS support said "just run troubleshooter" troubleshooter just tells you to enable UAC. Then tech support goes through a bunch of other generic stuff untill eventually "clean install windows".
This shouldn't be a required solution to use MS Store / UWP.
Decouple windows from MS store, make it usable. If you go through MS store most apps have 1-2/5 because of these terrible issues. Where in most cases the product is good, the DRM/installation is horrible.
I've had nearly 20 live chats with MS support, and have often created posts on technet, reddit etc. Just ranting here, demanding improvement because no MS staff seem to read those platforms just third party contracted support staff with no technical knowledge outside of copy pasting from the knowledge base.
#sfc /scannow lol

When add Kinect support?

I want to use Kinect v2 in my UWP app?
but Kinect SDK just support dotnet framework 4.5

ReorderThemeTransition doesn't work

There are no examples anywhere in the internet that show ReorderThemeTransition working. Tried to wire it using this example:

<Setter Property="ItemContainerTransitions">
    <Setter.Value>
        <TransitionCollection>
            <AddDeleteThemeTransition/>
            <ContentThemeTransition/>
            <ReorderThemeTransition/>
            <EntranceThemeTransition IsStaggeringEnabled="False"/>
        </TransitionCollection>
    </Setter.Value>
</Setter>

The insert and delete animation work just fine, but when I execute:

                observableCollection.Move(5, 2);

from a button, I get a reset of the list (it blinks and you see the list with the new order: no animation effects).
iOS has this feature, so why doesn't UWP?

Purple Screen

When I run this after using the command python -m SimpleHTTPServer, it just gives me a purple screen. I run the index.html file directly and it gives me the same thing.

Pixilation in the corner when using corner radius property

We are using a Rectangle with RadiusX & RadiusY properties but its corners are coming pixelated. Same is the case with Ellipse used. Is there a way to improve this?
https://drive.google.com/file/d/1bodfFpT6t5KDEmguBr2AXrQoAVAv2fNt/view?usp=sharing

First time after the app launch, it is opening in a default size other than the size set.

When you run the UWP app on a PC for the first time, the app will open in size(other than the height and width we set) other than the size we set. From second time when we open the app in that PC there is no issue, it will open in the size which we set. Issue is present only during first time open of the app on that particular PC.

• To reproduce this issue on the same PC we need to unistall and install the app and open the app. So that it behaves as if it is installed freshly on this PC and it opens in a size it wish(may be some default size values it taking when opened for first time).

• Our team tried to fix this by searching the place to put the default height and width values, but we didn't find any way. Is there any other way or is this a bug?

• The temporary solution we made is we are resizing the screen to the required size(height and width) values if the app is open for the first time on that PC.
  eg: we need to write this code in onnavigated to and onlaunched methods of app,xaml.cs:

`Size size = new Size(width, height);

ApplicationView.GetForCurrentView().SetPreferredMinSize(size);
ApplicationView.PreferredLaunchViewSize = size;
ApplicationView.PreferredLaunchWindowingMode=ApplicationViewWindowingMode.PreferredLaunchViewSize;`

Please, Don't use Git Branches like this

It's annoying the use of git branches in this repo. If I want to review more than one sample at a time I need to clone the repo multiple times.

I guess you should copy all samples to master, and use branches to add features to each one.

This is a really bad example on how to use git branches.

While application is busy doing some work, Rotation is not working fine.

If application is loading something and we rotate the screen, the rotation causes the App to freeze and App window is cropped.It leads to distorted App UI.

Cannot get LUIS App Settings to see the Key

Several attempts at creating a LUIS API in Azure have failed to produce a Key in the App Settings dropdown. My last attempt accessed Azure from the App Setting's link, and I successfully created the LUIS API resource. but selecting the link replaced the App Settings page in Edge, and returning to the settings page did not provide the key from Azure.

There does not seem to be an ability to manually paste the key from Azure to App Settings. So it looks like this sample is DOA. I am sad.

Freezing on "Connecting..." for tvOS target

I was able to build on Xamarin Studio/macOS for target tvOS simulator.
The build is ok. When the tvOS app starts it hangs while "connecting..."
I have a Soundcloud app configured (key and secret). My doubt is about the oAuth callback, that at this time does anything (just a localhost/callback uri) else than

<!DOCTYPE html>
<!-- saved from url=(0047)https://developers.soundcloud.com/callback.html -->
<html lang="en"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    
    <title>Connect with SoundCloud</title>
  </head>
  <body onload="window.setTimeout(window.opener.SC.connectCallback, 1);">
    <p>
      This popup should automatically close in a few seconds
    </p>
  

</body></html>

The file is index.html server at http://localhost:8888/callback

I have specified Twitter consumer key, secret and callback as well.

UWP Maps crash

Today my app crash, all UWP that use MAP control crash

xamarin/Xamarin.Forms#12878

UWP disaster !!!!!

Weather app - missing assembly references?

I have unity installed in the default location, but when I open the test project and build it I get these errors.

I'm also curious how the UWP app can access the class from the Unity project without them being connected? Do you need to include the Unity project in the same directory as the UWP one?

@petriw

Music app and Soundcloud credentials

SoundCloud does not allow to register new API access.
Any chance to update the MUSIC example to use something that is available for all people?

Null reference exception in HandleIntent(string text)

Unexpected Result
Here is the top of the stack when the exception is thrown (text argument reads "who is closest"):

at Microsoft.Cognitive.LUIS.Intent.Load(JObject intent)
at Microsoft.Cognitive.LUIS.LuisResult.Load(JToken result)
at Microsoft.Cognitive.LUIS.LuisResult..ctor(LuisClient client, JToken result)
at Microsoft.Cognitive.LUIS.LuisClient.d__19.MoveNext()

Steps Taken

• Double checked that the LUIS configuration properties were correct (so we'll need to add additional text to her suggestion when an exception occurs based on what we discover here)
• I tried speaking, "Show me photos from shen" and got the same exception
• Added an utterance to the LUIS model, and it came back with the correct Intent.

so flying blind here, I'm not sure what to do next. I don't suppose we can debug into LUIS...

Be Advised
oh, and for anybody coming later, if you want to debug AdventureWorks (and not feel like you're losing your mind), be sure to uncheck "Optimize code" in the (Project) Build properties.

Weather app not working

Thanks for amazing examples! Just watched the video, wanted to try out and sadly got no interface at all. So, can't see xaml - unity interop in action (see screenshot). Tried building desktop app - same thing.
I noticed, that I have "the referenced script on this behaviour is missing" warning on FogController (4 times in scene and prefab).
Not sure that it is related to the problem, but that problem may be fixed rather easy:

1. remove *.meta from gitignore and commit
2. now commit missing meta
   PS Unity stores guid in meta, which is used for example to link csharp script to gameobject in editor. So it's common mistake to put *.meta pattern in global .gitignore

Button with MenuFlyout doesn't work in tablet mode after instant drag of application

In XAML ,a button with MenuFlyout doesn't work for tablet mode after instant dragging the app. Video link is attached. Same happens for tablet,space devices in tablet mode.

https://drive.google.com/open?id=18hhdak4pckIjBIw0XngbmXSvAiPCPGTC

While resize UWP application it shows a blue color background for a second and then resize

Color shown on resize is the color of splash screen background.
Can we change the Splash-Screen background at runtime to make visual distinction less noticeable?

NorthwindPhoto: Need to check RadialController.IsSupported() before calling RadialController.CreateForCurrentView()

If RadialController.CreateForCurrentView() is called on a Windows edition that doesn't support the dial control it throws an exception. The code should check RadialController.IsSupported() before calling RadialController.CreateForCurrentView() so that it will work on all platforms that support UWP. Windows IoT Core for example.