c# - How to properly adapt the app UI on different screens on W10 -

i'm start porting wp8.1 app w10, , looks i'll have make universal windows app. now, i'm fine back-end code, i'll able reuse 90% of classes (models, viewmodels, , of helper classes, extension methods , converters).

the problem ui: understand i'll have design app different screens , aspect rations, , don't know how implement in code. mean, ui scaling, know can use visualstatemanager , adaptivetriggers manually set properties of ui elements want adapt on screen resolution, or can use converters, , that's fine.

whan mean is: what's best method have whole ui adapt different resolutions?

this example:

as can see: whole navigation pattern changes along ui when on different screens. on phones, have contact page covers whole ui, while on tablets , pcs have contact page that's fraction of ui, , pivot pages moved panel on right. also, many of ui elements rearranged. , of course, view-level back-end code change well.

now, i'm wondering what's best approach whole thing.

should i:

• have single xaml file (for every page) lot of visualstates , stuff, , try rearrange ui every screen resolution

• have different projects shared project (like w8.1 universal apps), can focus on ui on every specific device? approach i'd more comfortable with, i'd able design platform specific ui elements without problems. still, didn't understand how create shared project , different projects each device type in vs2015.

• use approach different xaml pages share same code-behind file (even i'm not sure how implement this, , how implement platform-specific code-behind parts).

• other method

i mean, i'm sure i'm not w8.1/wp8.1 developer in trouble here, there kind of advice can use? watched mva videos w10 development, didn't implementation details there.

thank help

sergio

those 2 screenshots aren't different, if @ using splitview control , relativepanel control.

see this //build talk more info.