UISegmentedControl to switch between UITableView and UIWebView in MonoTouch? - uiwebview

I have a UITableViewController that I am currently using for displaying of a UITableView. I need to add functionality to this controller so that the following is possible:
By default a UITableView is displayed in the main content of the controller.
A UISegmentedControl appears underneath the top navigation bar. This control contains two options.
On selecting the second option in the UISegmentedControl a UIWebView is displayed in the main content of the controller. When displaying the UIWebView the UISegmentedControl is still visible.
When selecting the first option in the UISegmentedControl the UITableView is displayed again.
Currently I have tried implementing this using the following code:
this.TableView.TableHeaderView = MakeHeaderControl ();
public UIToolbar MakeHeaderControl ()
{
try {
var toolBar = new UIToolbar (new RectangleF (0, 0, TableView.Bounds.Size.Width, 41));
toolBar.Items = null;
var seg = new UISegmentedControl (new RectangleF (5, 4, TableView.Bounds.Size.Width - 10, 33));
seg.InsertSegment ("First", 0, false);
seg.InsertSegment ("Second", 1, false);
seg.ControlStyle = UISegmentedControlStyle.Bar;
seg.SelectedSegment = 0;
seg.ValueChanged += (sender, e) => {
var web = new UIWebView (this.View.Frame);
this.View = web;
var req = new NSUrlRequest (new NSUrl ("URL"));
web.LoadRequest (req);
};
toolBar.Add (seg);
return toolBar;
}
The problems I am facing with this code is:
The UISegmentedControl scrolls with the UITableView.
The UISegmentedControl is not visible when the UIWebView is displayed.
How can I implement this functionality without the two problems above?

Related

Grouping textbox and label together

I have a lookup view on my xamarin.iOS app where the user puts their subdomain in and I want the textbox to be to the left of the label that has the parent domain, the image below shows what I basically want to achieve:
I was easily able to achieve this on android using drawables but my iOS skills are not as sharp so I'm lost on how I do this on iOS.
in iOS ,you can implment it in code.
in xxxViewController
public override void ViewDidLoad()
{
base.ViewDidLoad();
UIView backgroundView = new UIView(new CGRect(10,50,View.Bounds.Width-20,30));
UILabel domainLab = new UILabel()
{
Text = " https://www.example.com ",
Font = UIFont.SystemFontOfSize(12),
TextColor = UIColor.Gray ,
BackgroundColor=UIColor.LightGray,
Frame=new CGRect(0,0,150,30)
};
UITextField textField = new UITextField()
{
Frame=new CGRect(150,0,View.Bounds.Width-170,30),
};
textField.Layer.MasksToBounds = true;
textField.Layer.BorderColor = UIColor.LightGray.CGColor;
textField.Layer.BorderWidth = (System.nfloat)0.5;
backgroundView.AddSubview(domainLab);
backgroundView.AddSubview(textField);
View.AddSubview(backgroundView);
// Perform any additional setup after loading the view, typically from a nib.
}

Xamarin.ios: Search bar displays in every tab bar view

I'm building an iOS app with Xamarin.ios MvvmCross. In this app I use a tabbed view. on one tab view I wan't to display a search bar, but this search bar displays in every tab view. Anyone know how to resolve this so that I can hide the search bar in the other tab views?
Search bar Tab view:
public override void ViewWillAppear(Boolean animated)
{
base.ViewWillAppear(animated);
var searchController = new UISearchController(searchResultsController: null);
searchController.SearchBar.SizeToFit();
searchController.SearchBar.SearchBarStyle = UISearchBarStyle.Prominent;
TabBarController.NavigationItem.HidesSearchBarWhenScrolling = false;
TabBarController.NavigationItem.SearchController = searchController;
NavigationController.NavigationBar.PrefersLargeTitles = true;
this.Title = "Search";
_searchBar = searchController.SearchBar;
_searchBar.SearchButtonClicked += SearchBar_SearchButtonClicked;
_searchBar.TextChanged += SearchBarOnTextChanged;
_searchBar.CancelButtonClicked += SearchBarOnCancelButtonClicked;
TabBarController.NavigationItem.RightBarButtonItem = null;
}
Picture of tab view with search bar:
Search
Other tab views where I want to hide the search bar but can't get it done:
public override void ViewWillAppear(Boolean animated)
{
base.ViewWillAppear(animated);
//var searchController = new UISearchController(searchResultsController: null);
//searchController.SearchBar.Hidden = true;
var search = new UISearchController(searchResultsController: null);
TabBarController.NavigationItem.HidesSearchBarWhenScrolling = true;
search.SearchBar.Hidden = true;
NavigationController.NavigationBar.PrefersLargeTitles = true;
TabBarController.NavigationItem.RightBarButtonItem = null;
}
Picture of tab view where I don't want to show the search bar:
Home
This issue occurs because you just use one Navigation Controller wrapping your TabbarController. When user enter the second tabbar item(Search), you initialize a UISearchController and set it to the NavigationItem's SearchController. So this search bar appears as you want.
But when you return to the Home controller, this UISearchController will be still there since you just use one UINavigationController. Add the code below in your Home Controller's ViewWillAppear() event will fix your issue:
TabBarController.NavigationItem.SearchController = null;
I really recommend you to separate your one UINavigationController to four in your situation. Then each tabbar item controller has its own NavigationItem and will not affect each other. UITabbarController should be your app's root ViewController. Your app's hierarchy can be like this:
I use storyboard to draw two tabbar items helping you understand what I mean.
In this way in the Home controller, there's no need to add any code. You can just add the search bar in your Search controller with the code:
public override void ViewDidLoad()
{
base.ViewDidLoad();
var searchController = new UISearchController(searchResultsController: null);
searchController.SearchBar.SizeToFit();
searchController.SearchBar.SearchBarStyle = UISearchBarStyle.Prominent;
this.NavigationItem.HidesSearchBarWhenScrolling = false;
this.NavigationItem.SearchController = searchController;
NavigationController.NavigationBar.PrefersLargeTitles = true;
this.Title = "Search";
_searchBar = searchController.SearchBar;
_searchBar.SearchButtonClicked += _searchBar_SearchButtonClicked; ;
_searchBar.TextChanged += _searchBar_TextChanged; ;
_searchBar.CancelButtonClicked += _searchBar_CancelButtonClicked; ;
this.NavigationItem.RightBarButtonItem = null;
}
I move your code to ViewDidLoad() event and modify TabBarController.NavigationItem to this.NavigationItem.

How to create popover in Xamarin iOS (iPhone)?

I am creating a page where on click of a button a popover should appear as that in screenshot attached.
I have almost tried many methods to do so.but all ended up showing full screen.Is there really not any way to create a popover in Xamarin iOS?
Can any one help me with this?enter image description here
You can construct the custom pop view controller, then present it with the UIModalPresentationStyle Popover:
//The pop view controller you want to show, here I use Storyboard to initialize it
PopoverViewController popViewController = Storyboard.InstantiateViewController("PopoverViewController") as PopoverViewController;
//Set the presentation style to popover
popViewController.ModalPresentationStyle = UIModalPresentationStyle.Popover;
//The popover view's size
popViewController.PreferredContentSize = new CGSize(150, 150);
//The pop view's position
popViewController.PopoverPresentationController.SourceView = MyBtn;
popViewController.PopoverPresentationController.SourceRect = MyBtn.Bounds;
popViewController.PopoverPresentationController.PermittedArrowDirections = UIPopoverArrowDirection.Up;
//We can also customize the background color
//popViewController.PopoverPresentationController.BackgroundColor = UIColor.White;
popViewController.PopoverPresentationController.Delegate = new PopOverViewDelegate();
PresentModalViewController(popViewController, true);
Do not forget to set the delegate below to achieve the same effect on iPhone:
public class PopOverViewDelegate : UIPopoverPresentationControllerDelegate
{
public override UIModalPresentationStyle GetAdaptivePresentationStyle(UIPresentationController forPresentationController)
{
return UIModalPresentationStyle.None;
}
}

UITabBarController in xamarin.ios without using StoryBoard

In continue of my question in this post, I want to post a complete question which will be a question lots of xamarin.ios developers.
My request is having TabBar in ALL UIViewControllers. So, as I know, there are two ways to realize it.
First :
appDelegate -> set RootViewController : TabController -> UVC1
in this case, I have NULL NavigationController and I'll have no navigationItem. and in
this.NavigationController.PushViewController(new
SearchViewController(), true);
It makes error that NavigationController is null.
Here is my code in AppDelegate:
_tabController = new TabController();
_window.RootViewController = _tabController;
and my TabController :
public class TabController : UITabBarController
{
UIViewController tab1, tab2, tab3, tab4;
public TabController()
{
tab1 = new HomeViewController();
tab1.TabBarItem.Image = UIImage.FromFile("Icons/Home.png");
tab2 = new TagCategoryViewController(null, null, 1, null);
tab2.TabBarItem.Image = UIImage.FromFile("Icons/Tag.png");
tab3 = new SearchViewController();
tab3.TabBarItem.Image = UIImage.FromFile("Icons/Search.png");
tab4 = new ProfileViewController();
tab4.TabBarItem.Image = UIImage.FromFile("Icons/Home.png");
var tabs = new UIViewController[] {
tab1, tab2, tab3,tab4
};
ViewControllers = tabs;
}
}
And the second way :
RootViewController -> navigationController -> TabController -> UVC1 ->
new UVC2 -> no tab bar !!
Here, everything sounds good, but when I navigate to new UIViewController which is not present in Tabs, the TabBar will diappear !
And the code is :
_tabController = new TabController();
var navigationController = new UINavigationController(viewController);
_window.RootViewController = new UINavigationController(_tabController);
What can I do ? Any idea?
I don't use StoryBoard !
By wrapping all your UIViewController with UINavigationController you can enable the behaviour you want, but make sure that you remove TabBarController since the NavigationBar will overlap the NavigationBar from your Views.
_window.RootViewController = _tabController;
And your views:
tab1 = new UINavigationController(new HomeViewController());
tab1.TabBarItem.Image = UIImage.FromFile("Icons/Home.png");

Unable to update the text of a RootElement when used with a modal RadioGroup Section with MonoTouch Dialog

I am creating an iPad app using MonoTouch 2.10.11 and I want to MonoTouch.Dialog to create some of the editable fields on a form. One of the fields will use a RadioGroup to allow the user to select from a list of options. The default behavior of M.T.D is display the selection list table over the existing table. This works great for the iPhone layout, but on this iPad form, the table is only on a small area of the form and the navigation bar looks odd on the middle of the form. I want to display the selection as a full screen modal and the user will hit a "back" button to go back the previous form with the selected item.
I created a new RootElement descendant class like this:
public class ModalRootElement : RootElement
{
public override void Selected (DialogViewController dvc, UITableView tableView, NSIndexPath path)
{
tableView.DeselectRow (path, false);
UIViewController uIViewController = this.MakeViewController ();
this.PrepareDialogViewController (uIViewController);
dvc.PresentViewController (uIViewController, true, null);
}
protected override void PrepareDialogViewController(UIViewController dvc)
{
base.PrepareDialogViewController(dvc);
UIButton button = UIButton.FromType (UIButtonType.RoundedRect);
button.Frame = new RectangleF (5, 5, 80, 20);
button.SetTitle ("back", UIControlState.Normal);
button.TouchUpInside += delegate {
DialogViewController d = dvc as DialogViewController;
(d.Root as ModalRootElement).TableView.ReloadData ();
d.DeactivateController(true);
};
dvc.View.AddSubview (button);
}
}
The table is implemented with the following code:
var _status = new ModalRootElement("Status", new RadioGroup("status", -1)) {
(new Section() {
new RadioElement("New", "status"),
new RadioElement("In process", "status"),
new RadioElement("Rejected", "status"),
new RadioElement("Deferred", "status"),
new RadioElement("Transferred", "status"),
new RadioElement("Unknown", "status"),
new RadioElement("Complete", "status")
})
};
var _odom = new EntryElement ("Odometer", "current odom", "");
_odom.KeyboardType = UIKeyboardType.DecimalPad;
_odom.TextAlignment = UITextAlignment.Right;
var root = new RootElement ("back") {
new Section("") {
_status,
_odom
}
};
_dvc = new DialogViewController(root);
_nav = new UINavigationController (_dvc);
_nav.SetNavigationBarHidden (true, false);
When I run the app, I can drill into the RadioGroup and make a selection. When I click the back button that I added to the view, the modal view closes and the RadioSelected properted of the ModalRootElement object is set correctly, but the text is not displayed.
If I change Selected() method to call dvc.ActivateController instead of PresentViewController, the ModalRootElement displays the correct text, but the RadioGroup table has the wrong size. Is there a way to get the RootElement to display the correct text when you use PresentViewController instead of ActivateController?
I think you need a Root.Reload() call.

Resources