I have got a MVC4 application where I used 51Degrees (Lite) to detect device and accordingly select the mobile (.mobile.cshtml) or desktop (.cshtml) view. 51Degrees can properly do that job. However if I want to switch from Mobile to Desktop view (on a mobile device) using HttpContext.SetOverriddenBrowser(BrowserOverride.Desktop) it doesn't work. FYI, it works without 51Degrees.
Here is the code to select display mode (Application_Start() in Global.asax.cs):
DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode("mobile")
{ContextCondition = Context =>Context.Request.Browser["IsMobile"] == "True"
});
Here is the view switcher controller action code:
public class ViewSwitcherController : Controller
{
public RedirectResult SwitchView(bool mobile, string ReturnUrl="/Login/Login")
{
// If the mobile user has requested to view the mobile view
// remove any overridden user agent for the current request
if (Request.Browser.IsMobileDevice == mobile)
HttpContext.ClearOverriddenBrowser();
else
// Otherwise override the browser setting to desktop mode
HttpContext.SetOverriddenBrowser(mobile ? BrowserOverride.Mobile : BrowserOverride.Desktop);
return Redirect(ReturnUrl);
}
}
Here is the code in the view to switch to Desktop view:
#Html.ActionLink("Desktop view", "SwitchView", "ViewSwitcher", new { mobile = false, ReturnUrl = Request.Url.PathAndQuery }, new { rel = "external" })
Please let me know if I'm missing something.
Thanks in advance.
Sorry for my long delayed answer.
The following solution was provided by one of the developers at 51Degrees:
DisplayModeProvider.Instance.Modes.Insert(0, new DefaultDisplayMode("mobile")
{
ContextCondition = Context => Context.GetOverriddenBrowser()["IsMobile"] == "true"
});
So replacing Context.Request.Browser["IsMobile"] with Context.GetOverriddenBrowser()["IsMobile"] fixes my problem.
Hope that helps.
I know this is a bit dated, but I ran into this tonight. Same symptoms. Works without Mobi51, does not with. My working theory is that Request.Browser.IsMobileDevice is touched by Mobi51 and it takes control of that property and sets its value regardless of what you would expect .NET to do with it.
My current solution is this. When I check in my viewstart file to switch layouts I check that both Request.Browser.IsMobileDevice and Context.GetOverridenBrowser().IsMobileDevice are true.
When it's truly Mobile, both will be true. When it's truly desktop, both are false. When it's a mobile view requesting desktop, Request.Browser.IsMobileDevice will be true (because Mobi51 says so) and Context.GetOverridenBrowser().IsMobileDevice will be false. Here's my viewstart
#{
Layout = Request.Browser.IsMobileDevice && Context.GetOverriddenBrowser().IsMobileDevice
? "~/Views/Shared/_LayoutMobile.cshtml"
: "~/Views/Shared/_Layout.cshtml";
}
I'm still vetting this and have to add desktop to mobile switching still (which I can already see a problem, but the change to make that direction work as well is easy enough , but in my five minutes of testing so far tonight this has worked. I'm curious if you found another reason/way to work with this, or if this solution is satisfactory for you.
Related
I am trying to get my brain around what I can and can't reasonably do UI-wise in a multi-platform app. Initially we are only concerned about iOS and Android, but may need a mobile Windows version eventually.
The specific question is: How do I replicate the Android ExpandableListView functionality in iOS? I've tried a few searches, but haven't found a hint. The key I need is collapsible sections. Is that doable with an iOS listview? If so, do you have/know of an example?
The related non-specific question is: What advice do you have for someone just starting out developing in multimobilemono? I've been working from Greg Shackles' excellent book, "Mobile Development in C#" (which has been wildly helpful!), so I've got some basics. But I'm sure there are some hidden landmines when you get into more complex UI design. Any advice would be greatly appreciated.
Thank you!
You can use the UITableView, and merely change the size of your cell to display more content as needed.
Let us discuss DialogViewController (part of MonoTouch.Dialog) which simplifies the setup of a UITableView.
What you could do is create a UIView that contains both the content, and the expanded content. It would be controller with some property, for example:
bool expanded;
public bool Expanded { get { return expanded; }}
set {
if (expanded == value)
return;
Frame = ComputeSize (value);
expanded = value;
}
}
Then, create a UIViewElement:
new RootElement ("My Root") {
new Section () {
new UIViewElement (new MyView ());
}
}
For your first question, perhaps you could try :
https://github.com/OliverLetterer/SLExpandableTableView
There are a lot of samples showing how to pass a parameter on navigating to a page in Window 8 (WinRT). But I could not find any hint for passing parameters going back.
Situation: The user navigates to a details page of same data. The data is passed to the page by
Frame.Navigate(typeof(DedtailsPage), data);
How can I pass back the changed data on GoBack()?
Store the reference to data somewhere and retrieve it when you navigate back?
Also note that it's best not to pass objects other than simple strings or values between pages, since only simple types are supported for storing frame navigation state in case your app gets suspended.
I know, that this is a very bad idea, but usualy I use this:
To write:
Frame rootFrame = Window.Current.Content as Frame;
rootFrame.Tag = myObject1;
To read:
Frame rootFrame = Window.Current.Content as Frame;
var myObject2 = rootFrame.Tag;
I've made another choice to handle this.
Keep in mind that I'm a Xamarin developer (not Forms!) so i was looking for a solution which was similar for all platforms: iOS, Android and Windows.
I am a great fun of events, rather than passing objects or storing globals.
So the best choice to pass data from PageB (the child) to PageA (the parent) is to communicate via events.
Some notes: In iOS and Android, when you navigate from a "page" to "page" you can do this by passing an instance of the target object you want to navigate to. In iOS you create an instance of a custom UIViewController. In Android you create an instance of a custom Fragment. Doing this allow you to attach events handler to your instances.
An example:
var controller = new ExtrasViewController();
controller.ExtraSelected += ExtrasFragment_ExtraSelected;
controller.ExtrasCleared += ExtrasFragment_ExtrasCleared;
this.NavigationController.PushViewController(controller, false);
In WinRT Apps you are only allowed to pass "types" of target page to navigate to. So the only way to attach event handlers to your page instance is to use the OnNavigatedFrom method from the calling page. So suppose you are in PageA and want to attach some event handlers to your PageB, before it become active, simply write in your PageA "code behind":
protected override void OnNavigatedFrom(NavigationEventArgs e)
{
base.OnNavigatedFrom(e);
var page = e.Content as ExtraBody;
if(page != null)
{
page.ExtraSelected += ExtrasFragment_ExtraSelected;
page.ExtrasCleared += ExtrasFragment_ExtrasCleared;
}
}
How can I implement removing the backStack Entry in Metro style applications?
frame.SetNavigationState("1,0");
will clear the navigation history for you.
I found this answer useful:
How to clear Backstack of the frame and start afresh
Write your own NavigationService and store the navigationstate in the constructor.
string state;
public NavigationService(Frame mainFrame)
{
state = mainFrame.GetNavigationState();
_mainFrame = mainFrame;
_mainFrame.Navigating += _mainFrame_Navigating;
}
Then implement this method on the service and call it when needed:
public void ClearBackstack()
{
_mainFrame.SetNavigationState(state);
}
It doesn't seem to be possible. If you want to clear the back stack entirely (e.g. if you have a "home" button), you can use the code supplied in the LayoutAwarePage.cs file in the grid sample app.
if (this.Frame != null)
{
while (this.Frame.CanGoBack) this.Frame.GoBack();
}
While this doesn't actually clear the stack, it does take you back to the program's start location and there will be no further back-direction entries in the list. If you want to back out of a dead-end page by pressing a button, you could modify this behaviour to step back a number of pages and effectively remove the back entries.
I have an application where I'm using a Ajax Modal Pop Up extender to allow a user to add a new user and map them to a location using the Google Places Autocomplete box.
Used something suggested here:
http://kishor-naik-dotnet.blogspot.in/2011/12/aspnet-google-map-version-3-in-aspnet.html
My problem is that when I use this on a normal page, the suggestions appear correctly, but on a modal pop up extender they appear in the background. I want to bring this to the foreground. How do I do it?
This might be a bit late, but it should work.
//Have to do this or else the autocomplete list is hidden under the popup window
var pacContainerInitialized = false;
$('#autocompleteMapSearch').keypress(function () {
if (!pacContainerInitialized) {
$('.pac-container').css('z-index', '9999');
pacContainerInitialized = true;
}
});
What would be the best way to go about building an Adobe AIR app that doesn't have any windows (i.e. exists only in the system tray / dock)? I noticed that the default base tag in Flash Builder is <s:WindowedApplication> which seems to imply there'll be a window.
Should I just use <s:WindowedApplication> and call window.hide()? I saw there's another base class, <s:Application>, but I got the sense that was more for files that run in the browser. It seems like using window.hide() would briefly flash a window when the application starts which could confuse users. However I'd also ideally like to retain the ability to have the app open a window later if needed, or also to change the application from tray-only to windowed through an update.
You need to edit the app-config file to enable transparent chrome and visible = false. Then you need to change the WindowedApplication tag to and app your custom skin. You need to add control buttons for close etc, since that functionality isn't present in a web-app (since you have changed the tag). Also you need to add drag functionality. If you like to make your application re-sizable you need to add that too, manually.
In your manifest (-app.xml) file set systemChrome to none and transparent to true. The visible property is irrelevant, and the default is false anyway so ignore it.
you'll have to tweak this, import whatever classes are missing, etc... you could also do it as an mxml component and just set visible and enabled to false on the root tag. Fill up the trayImages array with the icons you want in the dock.
p
ackage{
import spark.components.WindowedApplication;
public class HiddenApplication extends WindowedApplication{
public function HiddenApplication(){
super();
enabled=false;
visible=false;
var trayImages:Array;
if(NativeApplication.supportsDockIcon||NativeApplication.supportsSystemTrayIcon){
NativeApplication.nativeApplication.activate();
var sep:NativeMenuItem = new NativeMenuItem(null,true);
var exitMenu:NativeMenuItem = new NativeMenuItem('Exit',false);
exitMenu.addEventListener(Event.SELECT,shutdown);
var updateMenu:NativeMenuItem = new NativeMenuItem('Check for Updates',false);
updateMenu.addEventListener(Event.SELECT,upDcheck);
var prefsMenu:NativeMenuItem = new NativeMenuItem('Preferences',false);
prefsMenu.addEventListener(Event.SELECT,Controller.showSettings);
NativeApplication.nativeApplication.icon.addEventListener(ScreenMouseEvent.CLICK,showToolBar);
if(NativeApplication.supportsSystemTrayIcon){
trayIcon = SystemTrayIcon(NativeApplication.nativeApplication.icon);
setTrayIcons();
trayIcon.tooltip = "Some random tooltip text";
trayIcon.menu = new NativeMenu();
trayIcon.menu.addItem(prefsMenu);
trayIcon.menu.addItem(sep);
trayIcon.menu.addItem(updateMenu);
trayIcon.menu.addItem(exitMenu);
}
else{
dockIcon = DockIcon(NativeApplication.nativeApplication.icon);
setTrayIcons();
dockIcon.menu = new NativeMenu();
dockIcon.menu.addItem(prefsMenu);
dockIcon.menu.addItem(sep);
dockIcon.menu.addItem(updateMenu);
dockIcon.menu.addItem(exitMenu);
}
}
function setTrayIcons(n:Number=0):void{
if(showTrayIcon&&(trayIcon||dockIcon)){
Controller.debug('Updating tray icon');
if(NativeApplication.supportsSystemTrayIcon){
trayIcon.bitmaps = trayImages;
}
else if(NativeApplication.supportsDockIcon){
dockIcon.bitmaps = trayImages;
}
}
else if(trayIcon||dockIcon) trayIcon.bitmaps = new Array();
}
}
}