Metro Nuggets

Bitesized tidbits for building Modern (Metro) apps.

Tag Archives: #wpdev

Using WebAccountProvider with Facebook on Windows 10 Mobile

For a while now, there have been a few ways for developers to allow a user to sign into Facebook:

  • They could use the WebAuthenticationBroker, which launched a hosted window the user could enter their details in;
  • They could use their own hosted WebView (WebBrowser on Silverlight) and send the user to the same place as the WebAuthenticationBroker and handle the navigations themselves;
  • They could use the Facebook Client SDK (in Silverlight), or the Windows SDK for Facebook (in Universal apps);
  • Manually create the URI scheme that would launch the Facebook app and have the app do the authentication for you.

With Windows 10, there’s a new way for developers to be able to authenticate their users, and that’s the WebAccountProvider. This allows account providers (like Facebook) to provide authentication using their Windows 10 app. Using this approach would mean your users would never have to leave the comfort of your app to get authenticated.

So what does all this mean? What is WebAccountProvider? It’s possible, in Windows 10, for apps to allow developers to explicitly use them as an authentication provider, without having to use URI schemes and callbacks to be set up by the calling app. The difference between this approach and the URI/Callback approach is this can be done silently so the user can potentially never leave your app but still get successfully authenticated.

IMPORTANT NOTE

All of this blog post is based on the current Windows 10 Facebook beta that came out recently. If you submit a Windows 10 app to the store before this version leaves beta, this code will not work as the user will likely be using the non-beta Facebook app. If you only depend on this approach, then your users will not be able to authenticate with Facebook, so it’s important to have some fallback methods.

This is now available in the non-beta version of Facebook for Windows 10 too, so will work for anyone who has updated their app.

Read more of this post

Got Unexpected, Extra Languages in Your UWP Store Submission?

If you’ve tried submitting a Windows 10 app to the store recently, you may have come across a problem where it’s asking you to enter store information for a language your app isn’t configured to support (in my case, I had an app that was en-GB, but it was requesting details for en-US, too). This can be frustrating because you probably don’t want to have to create the assets and store information for that extra language; so why is it appearing?

Read more of this post

Device Family Views: Some Continuum Advice

There are a number of blog posts, that show off a new feature in Windows 10 development call xaml views, that allow you to have a different xaml file for the same page depending on the device family (a great one here by Morten). There may be genuine reasons where going for an adaptive approach might not be right for your app depending on the design constraints of your app, in which case it makes perfect sense that you’d want device specific views.

Coming soon with the new Lumia devices is a nice feature called Continuum, which allows you to effectively use your phone as a PC, where you can connect it to a monitor, and use a mouse and keyboard with it, and really shows to highlight the universal aspect of Universal Apps as you effectively then have a desktop UI that you can use. So using a desktop on a mobile, what could go wrong?

Read more of this post

Dealing with Right-to-Left Languages, Things to Consider

Localising your apps can be hard, whether it’s finding the funds to get all your resources localised, or finding community members who will help you do it, it’s never easy. Those levels of difficulty can also be increased when you start to consider right-to-left languages, such as Arabic, or Hebrew, because it’s not just a question of adding those languages and you’re done. Far from it, in fact. Not only do you have to write extra code just to enable right-to-left, there are other practical matters that you may need to consider for your app’s design. Why? Because with right-to-left languages, the whole UI gets mirrored. Let’s look at some of those things you may need to think about.

Read more of this post

How to Display Ads/Review Prompts/Whatever Inline in Lists

A while back, I read a really interesting article on the best way to approach prompting your user to leave a review for your app, it’s a really good read, so I do encourage you to take a moment and give it the once over. The TL;DR version of it, though, is basically: don’t push a prompt up to yours users to leave a review, don’t do anything that shoves this kind of thing in the user’s face, be it ads, reviews or whatever. The suggested solution is to display your review prompts inline with the rest of your display data (this assumes you have that).

So how do we go about doing that on Windows Phone/Windows? Actually, it’s rather simple (sorry Silverlight, this is not for you).

Read more of this post

Creating a Weather App Style Adaptive Tile

In Windows 10, we’ve seen apps that look to have different tile faces and they cycle between those tiles. It’s a really nice effect and can be a very powerful thing for your app to use, it allows you to present more data to the user without having to have your tile all cramped. A good example of this would be a weather app where you might want to allow the user to show the weather for different places. So, how do you go about creating a tile like this?

Read more of this post

Introducing MDL2 Helpers

Another new thing that’s being introduced in Windows 10 is something that’s being seen as the next evolution of Metro: MDL2 (Microsoft Design Language 2). This brings about a whole new set of iconography for Windows 10, some of which can be seen in the settings app (on both phone and desktop).

If you want to read more about MDL2, whilst not technical, this would be a good place to start.

The icons that are available can be used by using the Font Segoe MDL2 then using the relevant code to get the icon. But where do you get those codes from? Well, Austin Andrews (@templarian) has put together a great online resource that lists the icons and their representations. But this can be a pain to copy and paste, look up what a code is, etc. So is there an easier way?

Read more of this post

Introducing AdaptiveTileExtensions for Windows 10

One of the things shown off at Build recently was this new thing for updating tiles, called Adaptive Tiles. The notion is, that like your Universal Windows Apps can adapt to different sizes on different platforms, so, too, should your tiles. So Adaptive tiles allows you, with one bit of XML tell your tile how to behave at different sizes. For more information, you should definitely watch the Build session on all this

The problem is, it means crafting the XML. And who likes XML?

Read more of this post

Sharing Links To Pocket (formerly Read It Later)

Pocket is a brilliant service that allows you to essentially bookmark links and (as the old name suggests), read it later. Pocket has no official app on the Windows Phone platform, but there are more apps coming from other sources (including my own Squirrel).

One of the things each of the apps has in common (other than being a Pocket client), is the ability to add links to Pocket from other apps. This is done using a custom URI scheme and works as expected. The only problem is, if you’re writing an app that you’d like to add Pocket support to, what do you do? Do you pledge your allegiance to one app? What if your users are using a different Pocket app? What then?

This was a problem I decided to address whilst writing my own Pocket app.

Read more of this post

Resizing the RadImageButton

Telerik have a great range of controls that allow you to build some really cool looking interfaces for Windows Phone. One of those controls is the RadImageButton, which lets you set an image and it creates an appbar style button for you. However, I wanted the button to be a different size to the default one, how to go about doing that?

Read more of this post