Windows 10 Dev Tool Preview - Views?

Question

There isn't much documentation and the samples  really don't help with working with the UI.

So the comment 

Another way to share code even as the UI adapts is to remember that multiple views (XAML files) can share a single code-behind file. For example, you can have a view for the mobile device family and another for the desktop device family, and have both share the same code-behind.

In: Guide to Windows universal apps

and similar in other documents is particularly irritating.

So anyone got a clue as to how to use multiple XAML files with a single code behind?

Answer 1

So, to understand your question correctly:

You have 2 XAML pages: Page1.xaml and Page2.xaml and you want to have one common code behind called: common_code_behind.cs and the paragraph from the documentation is misleading.

Please clarify.

---

Windows Store Developer Solutions, follow us on Twitter: @WSDevSol|| Want more solutions? See our blog

Answer 2

Let's say you have two versions of your XAML, Page1_Phone and Page1_PC or something. Each of those has a code behind (Page1_Phone.xaml.cc & Page1_PC.xaml.cs). Each of these pages should belong to the same class (e.g. Page1), but you'll navigate to the appropriate page depending on platform.

Create a 3rd code-behind file (e.g. Page1_Shared.xaml.cs) and make it a partial class:

public partial sealed class Page1

Put all your shared code in there and your platform-specific in the other files. It's all compiled to the same class.

I did a blog post recently (blog.grogansoft.com) about this very topic for Windows 8.1 apps (it should be a little different for Windows 10 because you don't have multiple projects necessarily). The post explains it in more detail, so have a look if the above doesn't make sense.

EDIT: p.s. You might want to upload an avatar image to your account because the random image generator gave you a rather unfortunate one.

---

I'm a self-taught noob amateur. Please take this into account when responding to my posts or when taking advice from me.

Answer 3

Yes you have part of what I am asking.

I know how to do a page with two XAML layouts and one code behind but it involves some work that VS doesn't support. 

The suggestion is that views are a new feature in VS that allows you to attach two XAML files to the same code behind and work with them naturally. 

This is how things are if you want to develop different layouts in Android Studio for example so it isn't an unreasonable approach. 

If this isn't the case perhaps some one could say so.

Answer 4

Yes I know how to do this but I want all the code to be shared and no non-shared code files.

I want XAMLBigScreen and XAMLSmallScreen  and  the same code behind file - just one. 

And I want to be able to select which XAML file is used when the app starts according to screen size. 

I can do this by manual coding the swap of the XAML files but the blogs on the new tools suggest that there are new mechanisms for doing this. 

For example in https://msdn.microsoft.com/en-us/library/windows/apps/dn609832.aspx

It says -

Create a device-specific view for a page

Sometimes you need more than adaptive controls and design states to achieve a tailored experience. No problem there. You can create device-specific views for your pages. they're not separate pages because they share the same code behind file.

Like device states, the Visual Studio Tools for Windows 10 Technical Preview does not yet contain features that help you create these but you can add them to your projects manually.

Learn more about Views.

But the link takes you to another dead end for info on "Views". 

This and other quotes suggests that Views are something new - of course that might be misleading.

And I like my avatar image - is there something I'm missing?

Answer 5

Windows 10 can still use visual states as far as I can tell. You detect the screen state (resolution, orientation) and select a layout based on your criteria. In this scenario all the XAML is contained in the same file (though you can switch between states in the editor to design them separately).

Check out this series of videos. In one of them they talk a bit about adapting the screen layout in Windows 10 and discuss some of the new controls.

http://www.microsoftvirtualacademy.com/training-courses/a-developers-guide-to-windows-10-preview

I don't know if there's a simple way to keep the XAML in separate files (other than using separate projects, which is not ideal), but visual states work well (and apparently the XAML code for them is much simpler in Windows 10).

Another option is to build your layouts as user controls that you load into the page's content, but that might require a lot of fiddly code.

---

I'm a self-taught noob amateur. Please take this into account when responding to my posts or when taking advice from me.

Answer 6

Yes I know about the VisualStateManager, but thanks for trying,  and how to use it but this is mentioned as an alternative to the VisualStateManager.

So it looks at the moment as if no one knows if there is something new or not.

As the logic of allowing an innocent programmer to use more than one XAML layout per code behind is so great I'm hoping that VS and the designer in particular will support it. It would be a much simpler way of handling screen resolution in many cases. 

Answer 7

I've just been told in another thread that Microsoft people read these posts every day on the look out for technical questions.

If so why no answer to this one?

Is Views a new feature of Windows 10 universal app dev or isn't it?

Answer 8

I believe I've stumbled upon what you're after in a blog post:

link

This lets you specify XAML to override the view based on device family. For example you can have a separate XAML for phone devices, but it will still share the same code behind file.

As mentioned in the blog post, this is subject to change.

---

Visit http://blog.grogansoft.com/ for Windows development fun.

Answer 9

@Infomax,

The response from @pumpkinszwan is correct - that you can have views per device family rather than arbitrary code.

Please also consider that this an initial preview release, providing a peek at the direction of the tooling. We’ll have more in there when we go deep into the details at Build and update the preview tooling.

http://blogs.windows.com/buildingapps/2015/03/23/windows-10-developer-tooling-preview-now-available-to-windows-insiders

---

Windows Store Developer Solutions, follow us on Twitter: @WSDevSol|| Want more solutions? See our blog