Microsoft Tech Community Live: Surface Edition
February 15, 2022, 08:00 AM - 12:00 PM (PST)

Why my view rendering differs between emulator and an actual device?

%3CLINGO-SUB%20id%3D%22lingo-sub-1739959%22%20slang%3D%22en-US%22%3EWhy%20my%20view%20rendering%20differs%20between%20emulator%20and%20an%20actual%20device%3F%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1739959%22%20slang%3D%22en-US%22%3E%3CP%3EHi%20team%2C%3C%2FP%3E%3CP%3EI%20hope%20you%20are%20all%20doing%20great!%20I%20just%20got%20my%20very%20first%20feedback%20of%20running%20my%20little%20experimental%20app%20on%20a%20real%20Surface%20Duo%20device.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EIt's%20awesome%20to%20see%20it%20live%20in%20action%20without%20having%20any%20chance%20to%20try%20it%20by%20myself.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3ENevertheless%2C%20I%20wittnessed%20that%20the%20rendering%20(one%20column%20vs.%20two%20columns)%20is%20rendered%20differently%20in%20my%20emulator%20app%20and%20on%20the%20real%20device.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSTRONG%3EReal%20device%3C%2FSTRONG%3E%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22MicrosoftTeams-image.png%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F223699i81DAD0E295AD3AE1%2Fimage-size%2Fmedium%3Fv%3D1.0%26amp%3Bpx%3D400%22%20title%3D%22MicrosoftTeams-image.png%22%20alt%3D%22MicrosoftTeams-image.png%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%3CSTRONG%3EEmulator%20screenshot%E2%80%83%3C%2FSTRONG%3E%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20image-alt%3D%22Unbenannt.PNG%22%20style%3D%22width%3A%20400px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F223700iC2CA093FEA446264%2Fimage-size%2Fmedium%3Fv%3D1.0%26amp%3Bpx%3D400%22%20title%3D%22Unbenannt.PNG%22%20alt%3D%22Unbenannt.PNG%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSTRONG%3ESource%3C%2FSTRONG%3E%3C%2FP%3E%3CP%3EI%20just%20use%20the%20ScreenHelper%20function%3A%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CPRE%20class%3D%22lia-code-sample%20language-csharp%22%3E%3CCODE%3EScreenHelper.IsDualScreenDevice(Application.Context)%3B%3C%2FCODE%3E%3C%2FPRE%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EI%20use%20this%20value%20in%20my%20master%20view%20code%20behind%20to%20set%20the%20width%20of%20the%20second%20column.%3C%2FP%3E%3CPRE%20class%3D%22lia-code-sample%20language-csharp%22%3E%3CCODE%3E%2F%2F%20Check%20if%20app%20runs%20on%20a%20Duo.%0Aif(DependencyService.Get%3CISURFACEDUOINFORMATIONSERVICE%3E().IsDuo())%0A%7B%0A%20%20%20%20SecondColumnWidth%20%3D%20new%20GridLength(1%2C%20GridUnitType.Star)%3B%0A%7D%0Aelse%0A%7B%0A%20%20%20%20SecondColumnWidth%20%3D%20new%20GridLength(0%2C%20GridUnitType.Absolute)%3B%0A%7D%3C%2FISURFACEDUOINFORMATIONSERVICE%3E%3C%2FCODE%3E%3C%2FPRE%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThanks%20for%20any%20helpful%20tip!%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-1801436%22%20slang%3D%22en-US%22%3ERe%3A%20Why%20my%20view%20rendering%20differs%20between%20emulator%20and%20an%20actual%20device%3F%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-1801436%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F348774%22%20target%3D%22_blank%22%3E%40tscholze%3C%2FA%3E%26nbsp%3Bcan%20you%20clarify%20your%20question%3F%20In%20the%20second%20(emulator)%20screenshot%2C%20the%20app%20isn't%20spanned%20onto%20both%20screens.%3C%2FP%3E%0A%3CP%3ECan%20you%20put%20the%20app%20in%20the%20same%20state%20(spanned%20across%20two%20screens)%20and%20add%20the%20screenshot%20so%20we%20can%20see%20how%20that%20looks%20on%20the%20emulator%3F%20It%20might%20also%20be%20helpful%20to%20explain%20what%20you%20expect%20the%20behavior%20to%20be%2C%20and%20to%20confirm%20via%20debugging%20that%26nbsp%3B%3C%2FP%3E%0A%3CPRE%20class%3D%22lia-code-sample%20%20language-csharp%22%3E%3CCODE%3EIsDuo()%3C%2FCODE%3E%3C%2FPRE%3E%0A%3CP%3Ereturns%20the%20expected%20value.%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E
Frequent Contributor

Hi team,

I hope you are all doing great! I just got my very first feedback of running my little experimental app on a real Surface Duo device.

 

It's awesome to see it live in action without having any chance to try it by myself.

 

Nevertheless, I wittnessed that the rendering (one column vs. two columns) is rendered differently in my emulator app and on the real device.

 

Real device

MicrosoftTeams-image.png

Emulator screenshot 

Unbenannt.PNG

 

Source

I just use the ScreenHelper function:

 

 

ScreenHelper.IsDualScreenDevice(Application.Context);

 

 

I use this value in my master view code behind to set the width of the second column.

// Check if app runs on a Duo.
if(DependencyService.Get<ISurfaceDuoInformationService>().IsDuo())
{
    SecondColumnWidth = new GridLength(1, GridUnitType.Star);
}
else
{
    SecondColumnWidth = new GridLength(0, GridUnitType.Absolute);
}

 

 

 

Thanks for any helpful tip!

2 Replies

@tscholze can you clarify your question? In the second (emulator) screenshot, the app isn't spanned onto both screens.

Can you put the app in the same state (spanned across two screens) and add the screenshot so we can see how that looks on the emulator? It might also be helpful to explain what you expect the behavior to be, and to confirm via debugging that 

IsDuo()

returns the expected value. 

Hi @Craig_Dunn,

sorry for my really late response. I attached a screenshot on how it looks using the emulator.

You see on the left side two columns aka "RSS Feed", and "YouTube Feed".

 

I present the YT column only if the isDuo() check returns true. It seems that the check returns on an actual Surface Duo device "false". Due to the fact that I have no Duo available, I cannot attach a debugger on a released version.

 

It could be also a timing issue. It is just weird why it works as intended on the emulator but not on a real device. *hm*

 

(The "insert photo" button did not work, that's why it is just an attachment)