How to achieve Windows Phone 8 News App layout - c#

I am wondering how does the News app on Windows Phone achieve its layout. I am taking about the main page when the app is first launched. It is not a pivot because you can see the next section on the current section. It is not a panorama because the background is not moving, and that it is a universal app so Panorama is not available. It is not a Hub because Hub does not allow you to wrap from the first to last, or vice versa.
I notice this layout is very similar, almost identical to the layout of the Fitbit app. I like this kind of layout a lot and I would like to use that on my own app. If there is a control for it please let me know, if not, how do I do what the developer have done on those apps.

The app is using the Panorama/Hub control. It does not set the title of the control and it does not have an image for it. The first Page/Section does have an image for the main article. this image is only set for that Page/Section. The first section also does not have a Header set (it's blank).
Hope that helps!

Related

Navigation to another page using swipe gesture (Windows Phone 8)

I've searched quite a lot on the Internet but haven't been able to found the exact thing that I want.
I now that I should be using the Manipulation events such as Manipulation Started, Delta, Completed.
As I said I managed to navigate to another page using swipe combining these three events, but what I actually want is to see THE MOTION when moving from the actual page to another like for example when you swipe from the Official Windows Phone 8 page to the Apps page using a left swipe. Can you please point out on how to achieve such a thing.
http://agilemobility.net/2014/07/windows-phone-8-swipe-gesture/
This page shows an example on how to that, but the motion of moving the current page and bringing the second one is displayed.
I wasn't aware of the following, and yes, Pivot is the answer to my question.
Taken from: https://msdn.microsoft.com/en-us/library/windows/apps/ff941103(v=vs.105).aspx
You can use a custom template named Windows Phone Pivot App when creating a new project. This template will come pre-populated with content and you can modify the template accordingly.
List itemThe Pivot control can be added to the Toolbox in Visual Studio and can be easily dropped into your project.
You can add a Windows Phone Pivot Page to an existing project.

Creating a slideshow in windows phone 8 without using pivot app

I'm writing a windows 8 app wich basically does nothing when you open it (everything is done in background task and the user doesn't see it) so I need to display a kind of slideshow on the main page of the app just so it looks like something and not just a blank page.
My problem is I can't use the pivot app template, I need to start from a blank template.
So I'd like to know what is the most simple way of doing this ? By the way, I need the slideshow to switch between the images automatically (with a timer that I can set) but the user can switch himself if he wants to
Thank you :)
You say You can't use the pivot app template and want to start using a blank template.
You can however add pivot as a control once you start with a blank template.
If Not using pivot is your aim, then try panorama.
Start from a blank template and add panorama control to it. Panorama can also help you to get a nice sliding effect like in a slideshow.
you can have images in stackpanel and detect Flick Gestures whether left to right or viceversa through HorizontalVelocity of Flick events.

WPF applacation window screen shot displayed on button

i have create a few WPF applications in visual studio, and now i would like to create a final application to run all of the created apps in the final application. i would like to know how i can create a layout that displays the apps that are running inside the final app as buttons that can be clicked and cause the app to expand and allow the user to work on that app and then when finished return back to the final app and see the other apps to choose from. I imagine it would look like a Google chrome blank page that allows you see your familiar webpages and click on them to load them up. Any help or advice on what i should focus on to implement this would be much appreciated.
Thank you for taking the time to read over this.
Consider using a VisualBrush this takes other WPF UI (your "apps") and uses their UI as a brush for another UI element.
Raj Kumar has a simple article called Visual Brush in WPF for details.
The bit you probably want is at the bottom where he shows you rendering a controls content in another control. The magic being binding the controls visual to the element name whos UI it should render.

Application Bar scrolls up the Webbrowser view in Windows phone App

I have been working on a windows phone 8 app. I have given complete space of my layout to a WebBrowser element which renders my mobile site's pages.
Those pages has:
-A fixed header at the top.
-A fixed text box for replies and search at the bottom
-And a scrollable region in between.
I have also provided my app with an Application Bar which provides buttons for some quick links. Application Bar comes and goes depending on the page user is.
Now the problem is:
- When Application Bar comes up, my whole pages scrolls up and the fixed header goes out of view. without Application Bar things are fine.
Somebody else facing the same problem?
Are there any workarounds for this?
NOTE - I tried reserving some space for the application bar and giving rest of the space to WebBrowser, but that also doesn't help. And strange thing is, things are working fine on emulator.
Thanks
I wonder if the platform does the same thing that happens when the SIP shows up - that would mean the root visual element has a RenderTransform/TransformGroup/TranslateTransform that gets updated when some OS component like the app bar shows up. Check Vinoth's answer to this question here:
Scrollable form control in Windows Phone 8
It is normal for the page to scroll up (i.e. title disappears) when application bar opens. you can not do much about that.
If your need is to have whole webpage visible including the title when the application bar is in view, then you need to reduce the height of web browser so it fit into a smaller window.

MVVM shared between Win8 and WP8 (2 pages in one page)

We have a Windows Phone 8 application that uses MVVM. There are a couple of pages that work in the following way. Page 1 has some buttons and when one of them is clicked, page 2 is opened.
Now we want to migrate our application to Windows 8. Because of the bigger screen size, we can actually display both the buttons and the content on the same page (see the attached picture). Basically we are going to have a single screen on which we dynamically change a part of it (the right side with green)
We would like to share the view models between the two application. Is there a pattern to use for something like this?
There are a few alternatives that we investigated but we are not sure which one is correct:
Should "some content" (the second page in WP8) be a user control in the windows app?
Should we create a completely new view model for the Win8 that has the code from multiple view models in the WP8 app? This sounds like a bad idea though because we have about 6 view models in the WP 8 app that are now displayed on the same page in the win app.
Should the Win 8 view models somehow "contain" the other view models?
Should the dynamic content (the green box) have its own MVVM?
Ideas? Suggestions?
Well, this depends too much on your application to give any definite answer. But since pressing the buttons will load different content in the W8 app, MVVM can solve this without too much problems.
So, in WP8 app pressing the buttons issues a message that triggers navigation. In W8 you can change that message handler to destroy user control and create new one. In WP8 app your second screen was a standalone page with its own view model, there is no reason to not have a user control on W8 using that same view model.
However, you have to write UI from scrath since XAML cannot be shared.

Categories