CODEWITHSUNDEEP
c#xamlwin-universal-appuwpwindows-10-universal
Shani74
Shani74

Reputation: 63

how to add two xaml page with same name and separate code file behind in uwp

Hi I want to have two different layouts, one for mobile other for pc and for this I want to add two xaml page with same name MainPage.xaml and code file behind MainPage.xaml.cs. One page added into DeviceFamily-Mobile folder and other in main area of project.

Now when I run the app it gives this error:

"Type 'MainPage' already defines a member called '.ctor' with the same parameter types"

To overcome this problem I add parameter in constructor of mainpage for desktop. Now project runs successfully and both page and code works good but I just noticed that parameterized constructor of desktop page not being called...

Now my summarized question is how can i add two page with same name and different code file behind for specific device family.

I have search a lot but did not get answer of my question.
Please suggest me any solution of my problem any tip.

Thanks

Note: One more thing, I don't want different xaml page with same one code file.

Upvotes: 3

Views: 1042

Answers (3)

peterfaraday MSFT
peterfaraday MSFT

Reputation: 81

i) To create a page which targets different devices the XAML file is named using a specific syntax based on MRT. We have tooling support for this in Visual Studio:

First, create a new folder in your project by right clicking on the project->Add New Item->New Folder. This folder needs to be named to target a particular device family – in this case we will use Mobile (which includes Phone) using ‘DeviceFamily-Mobile’.The tailored XAML view is then created in Visual Studio using the ‘XAML view’ template. Select the folder you added, then right click->Add New Item->XAML View. Make sure you edit the name to be MainPage.xaml (by default it will be named MainPage1.xaml). You need to use the same name so that the code behind will be shared an the page correctly loaded.

Both views share the same code behind (MainPage.xaml.cs in the above example), and creating an event handler in one can also be used in the other view. When the app is run, Universal Windows will pick the correct view based on the device family that the app is being run on.

ii) If you want to special case code for a particular view you can test for the devicefamily as follows

if (Windows.System.Profile.AnalyticsInfo.VersionInfo.DeviceFamily == "Windows.Mobile")

Upvotes: 2

Stamos
Stamos

Reputation: 3998

The Pages in UWP are partial witch means you can create a new cs and just write public partial class MainPage{} and continue the class from there. You could then use conditional compilation.

As I searched a bit I couldn't find any conditional compiling in UWP but only for Universal(Second link). But the first link might help.

Three ways to set specific DeviceFamily XAML Views in UWP

Conditional Compilation in Universal Apps

Upvotes: 0

thang2410199
thang2410199

Reputation: 1942

You can not. You must create 2 difference Page to have difference code behind.

I would suggest:

  • Refactor your code behind using dependency injection and interface so it adaptive to device family

Upvotes: 0

Related Questions