Has anyone gotten Xamarin-Sidebar, MVVMCross & Storyboards to work together? - menu

I've tried all permutations I can find on the web and just can't seem to get this to work.
I have my iOS app UI defined within a storyboard and the MVVM framework is mostly MVVMCross with some sprinkling of ReactiveUI thrown in for flavor.
I have a RootViewController defined where I generate the SideBarController that is attached to the AppDelegate as so:
[Register ("AppDelegate")]
public partial class AppDelegate : MvxApplicationDelegate
{
public override UIWindow Window {
get;
set;
}
public AppDelegate ()
{
}
public SidebarController SidebarController { get; set; }
public override void FinishedLaunching (UIApplication application)
{
var presenter = new MvxModalSupportTouchViewPresenter (this, Window);
var setup = new Setup (this, presenter);
setup.Initialize ();
var startUp = Mvx.Resolve<IMvxAppStart> ();
startUp.Start ();
}
}
And in the RootViewController I have:
public override void ViewDidLoad()
{
base.ViewDidLoad();
if (ViewModel == null)
return;
var appDelegate = UIApplication.SharedApplication.Delegate as AppDelegate;
appDelegate.SidebarController = new SidebarController (this,
(UIViewController)this.CreateViewControllerFor<LoginViewModel>(),
(UIViewController)this.CreateViewControllerFor<SideMenuViewModel>());
appDelegate.SidebarController.MenuWidth = 250;
appDelegate.SidebarController.ReopenOnRotate = false;
appDelegate.SidebarController.MenuLocation = SidebarController.MenuLocations.Right;
}
After the user has a successful login they are then navigated to a landing page that has a burger button on it. Once the user clicks the burger button the side menu isn't show but all tracing before and after the ToggleMenu() call gets executed. I'm racking my brain trying to get this to work but after 3 days I think I may have given myself a concussion.
Has anyone tried to get this combo working?

For me it is working. I am not exactly sure where your problems is, but this is my code:
[Register ("AppDelegate")]
public partial class AppDelegate : MvxApplicationDelegate
{
UIWindow window;
public RootViewController RootViewController { get { return window.RootViewController as RootViewController; } }
public override bool FinishedLaunching (UIApplication app, NSDictionary options)
{
window = new UIWindow(UIScreen.MainScreen.Bounds);
var presenter = new Presenter(this, window);
var setup = new Setup(this, presenter);
setup.Initialize();
var startup = Mvx.Resolve<IMvxAppStart>();
startup.Start();
window.MakeKeyAndVisible();
return true;
}
}
And for the rootcontroller:
public class RootViewController: UIViewController, IMvxCanCreateTouchView
{
public SidebarController SidebarController { get; private set; }
private UIViewController root;
public RootViewController (UIViewController root)
{
this.root = root;
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
var menuContentView = this.CreateViewControllerFor<MenuViewModel> () as MenuViewController;
SidebarController = new SidebarController (this, root, menuContentView) {
MenuLocation = SidebarController.MenuLocations.Left,
HasShadowing = false
};
}
public void NavigateToView (UIViewController view)
{
SidebarController.ChangeContentView (new UINavigationController (view));
}
}
As a Base class for my other controllers i have this:
public interface IControllerWithCustomNavigation
{
void NavigateToView (UIViewController controller);
}
public class BaseController<TViewModel>: MvxViewController where TViewModel: BaseViewModel
{
protected bool NavigationBarEnabled = true;
public new TViewModel ViewModel {
get { return (TViewModel)base.ViewModel; }
set { base.ViewModel = value; }
}
public BaseController (string nib) : base (nib, null)
{
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
if (NavigationBarEnabled) {
NavigationController.NavigationBarHidden = false;
updateNavigationBar ();
if (isRootViewModel()) {
addNavigationBarItemForMenu ();
}
} else if (NavigationController != null) {
NavigationController.NavigationBarHidden = true;
}
}
private void updateNavigationBar()
{
var navigationBar = NavigationController.NavigationBar;
var colorTint = UIColor.FromRGB (133, 231, 110);
var colorWhite = UIColor.White;
navigationBar.BarTintColor = colorWhite;
navigationBar.TintColor = colorTint;
navigationBar.SetTitleTextAttributes (new UITextAttributes {
TextColor = UIColor.FromRGB (13, 19, 26)
});
}
private bool isRootViewModel()
{
return NavigationController.ViewControllers.Length < 2; // Every view, even the RootView, is counted here.
}
private void addNavigationBarItemForMenu()
{
var sidebarButton = new UIBarButtonItem (
UIImage.FromFile ("menu_icon.png"),
UIBarButtonItemStyle.Plain,
(object sender, EventArgs e) => {
(UIApplication.SharedApplication.Delegate as AppDelegate).RootViewController.SidebarController.ToggleMenu();
}
);
NavigationItem.SetLeftBarButtonItem (sidebarButton, true);
}
public virtual void NavigateToView (UIViewController controller)
{
(UIApplication.SharedApplication.Delegate as AppDelegate).RootViewController.NavigateToView (controller);
}
}

So after looking over the code that Martijn posted and then actually doing some snooping through his previous posts, I decided that it would be best to create my own MvxViewPresenter and so far it works.
public class SideBarControllerTouchViewPresenter : MvxModalSupportTouchViewPresenter
{
private UIWindow _window;
public SidebarController SidebarController {
get ;
set ;
}
public UIViewController RootController {
get;
private set;
}
public SideBarControllerTouchViewPresenter (UIApplicationDelegate applicationDelegate, UIWindow window)
: base(applicationDelegate, window)
{
_window = window;
}
public override void ChangePresentation (Cirrious.MvvmCross.ViewModels.MvxPresentationHint hint)
{
base.ChangePresentation (hint);
}
protected override void ShowFirstView (UIViewController viewController)
{
base.ShowFirstView (viewController);
}
protected override UINavigationController CreateNavigationController (UIViewController viewController)
{
var navController = new UINavigationController (viewController);
var menuController = UIStoryboard.FromName ("storyboard", null).InstantiateViewController ("MenuTableViewController") as MenuTableViewController;
RootController = new UIViewController ();
SidebarController = new SidebarController (this.RootController, navController, menuController);
return navController;
}
protected override void SetWindowRootViewController (UIViewController controller)
{
_window.AddSubview (RootController.View);
_window.RootViewController = RootController;
}
}
So thanks for getting me the rest of the way there.

Related

Xamarin QLPreviewController + NavigationPage broken on iOS 10

After updating the device to iOS 10, QLPreviewController stopped to display correctly the documents. It shows the white screen.
I have extracted the sample scenario from the app.
It contains single page with two buttons that should load two different documents:
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:QuickLookIOS10Test"
x:Class="QuickLookIOS10Test.QuickLookIOS10TestPage">
<StackLayout Orientation="Vertical">
<Button Text="Load first doc" Clicked="OnLoadFirstClicked"/>
<Button Text="Load second doc" Clicked="OnLoadSecondClicked"/>
<Button Text="Navigate forward" Clicked="OnForwardClicked"/>
<local:QLDocumentView
x:Name="DocumentView"
BackgroundColor="Silver"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand"/>
</StackLayout>
</ContentPage>
where:
public class QLDocumentView : View
{
public static readonly BindableProperty FilePathProperty =
BindableProperty.Create(nameof(FilePath), typeof(string), typeof(QLDocumentView), null);
public string FilePath
{
get { return (string)GetValue(FilePathProperty); }
set { SetValue(FilePathProperty, value); }
}
}
There is a custom renderer involved:
public class QLDocumentViewRenderer : ViewRenderer<QLDocumentView, UIView>
{
private QLPreviewController controller;
public override SizeRequest GetDesiredSize(double widthConstraint, double heightConstraint)
{
//This is a fix to prevent incorrect scaling after rotating from portrait to landscape.
//No idea why does this work :( Bug #101639
return new SizeRequest(Size.Zero, Size.Zero);
}
protected override void OnElementChanged(ElementChangedEventArgs<QLDocumentView> e)
{
base.OnElementChanged(e);
if (Control == null)
{
controller = new QLPreviewController();
SetNativeControl(controller.View);
}
RefreshView();
}
protected override void OnElementPropertyChanged(object sender,
System.ComponentModel.PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);
if (e.PropertyName == QLDocumentView.FilePathProperty.PropertyName)
{
RefreshView();
}
}
private void RefreshView()
{
DisposeDataSource();
if (Element?.FilePath != null)
{
controller.DataSource = new DocumentQLPreviewControllerDataSource(Element.FilePath);
}
controller.ReloadData();
}
protected override void Dispose(bool disposing)
{
base.Dispose(disposing);
if (disposing)
{
DisposeDataSource();
DisposeController();
}
}
private void DisposeDataSource()
{
var dataSource = controller.DataSource;
controller.DataSource = null;
dataSource?.Dispose();
}
private void DisposeController()
{
controller?.Dispose();
controller = null;
}
private class DocumentQLPreviewControllerDataSource : QLPreviewControllerDataSource
{
private readonly string fileName;
public DocumentQLPreviewControllerDataSource(string fileName)
{
this.fileName = fileName;
}
public override nint PreviewItemCount(QLPreviewController controller)
{
return 1;
}
public override IQLPreviewItem GetPreviewItem(QLPreviewController controller, nint index)
{
NSUrl url = NSUrl.FromFilename(fileName);
return new QlItem(url);
}
private sealed class QlItem : QLPreviewItem
{
private readonly NSUrl itemUrl;
public QlItem(NSUrl uri)
{
itemUrl = uri;
}
public override string ItemTitle { get { return string.Empty; } }
public override NSUrl ItemUrl { get { return itemUrl; } }
protected override void Dispose(bool disposing)
{
base.Dispose(disposing);
if (disposing)
{
this.itemUrl?.Dispose();
}
}
}
}
}
If the application setups the main page like below:
MainPage = new NavigationPage(new QuickLookIOS10TestPage());
it does work on iOS 9.3 but not on iOS 10. If I remove NavigationPage:
MainPage = new QuickLookIOS10TestPage();
it works on both iOS versions.
The code behind for button clicks just sets the FilePath property of the control.
Sample app demonstrating the problem
Xamarin Forms 2.3.2.127
Xamarin Studio 6.1.1 (build 15)
I've faced with the same problem. It looks like something was changed or even broken in QuickLook in iOS10, but the solution is quite simple:
public class PdfViewerControlRenderer : ViewRenderer<PdfViewerControl, UIView>
{
private readonly bool IsOniOS10;
private UIViewController _controller;
private QLPreviewController _qlPreviewController;
public PdfViewerControlRenderer()
{
IsOniOS10 = UIDevice.CurrentDevice.CheckSystemVersion(10, 0);
}
protected override void OnElementChanged(ElementChangedEventArgs<PdfViewerControl> e)
{
if (e.NewElement != null)
{
_controller = new UIViewController();
_qlPreviewController = new QLPreviewController();
//...
// Set QuickLook datasource here
//...
if (!IsOniOS10)
{
_controller.AddChildViewController(_qlPreviewController);
_controller.View.AddSubview(_qlPreviewController.View);
_qlPreviewController.DidMoveToParentViewController(_controller);
}
SetNativeControl(_controller.View);
}
}
public override void LayoutSubviews()
{
base.LayoutSubviews();
_controller.View.Frame = Bounds;
_controller.View.AutoresizingMask = UIViewAutoresizing.FlexibleWidth | UIViewAutoresizing.FlexibleHeight;
_qlPreviewController.View.Frame = Bounds;
if (IsOniOS10)
{
_controller.View.AddSubview(_qlPreviewController.View);
_qlPreviewController.DidMoveToParentViewController(_controller);
}
}
}
Result:

Navigating to UIViewController from table cell

I am new to xamarin ios. I am trying to navigate from table cell to present uiviewcontroller.But in my RowSelected method which is in table source class throws "system.nullreference exception" .I am using storyboard and this is my code.
This is my app starting point viewcontroller code
namespace PopulatingTableView
{
public partial class PopulatingTableViewViewController : UIViewController
{
// UITableView table;
public PopulatingTableViewViewController (IntPtr handle) : base (handle)
{
}
public override void DidReceiveMemoryWarning ()
{
// Releases the view if it doesn't have a superview.
base.DidReceiveMemoryWarning ();
// Release any cached data, images, etc that aren't in use.
}
#region View lifecycle
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
button.TouchUpInside += (object sender, EventArgs e) => {
this.NavigationController.PushViewController(new Listview(),true);
};
}
public override void ViewWillAppear (bool animated)
{
base.ViewWillAppear (animated);
}
public override void ViewDidAppear (bool animated)
{
base.ViewDidAppear (animated);
}
public override void ViewWillDisappear (bool animated)
{
base.ViewWillDisappear (animated);
}
public override void ViewDidDisappear (bool animated)
{
base.ViewDidDisappear (animated);
}
#endregion
}
}
And this my table viewcontroller codes.
namespace PopulatingTableView
{
public partial class Listview : UITableViewController
{
UISearchBar search;
UITableView table;
Listview _list;
public Listview()
{
}
public Listview (IntPtr handle) : base (handle)
{
search = new UISearchBar ();
search.BackgroundColor = UIColor.Clear;
}
public override void ViewDidLoad()
{
base.ViewDidLoad();
table = new UITableView(View.Bounds);
customcell ();
RectangleF search_frame = new RectangleF (0,80,300,30);
search = new UISearchBar (search_frame);
View.Add (search);
View.Add(table);
}
public void customcell()
{
List<TableItems> tableItems = new List<TableItems>();
tableItems.Add(new TableItems("Vegetables") { ImageName = "date.png" });
tableItems.Add(new TableItems("Fruits") { ImageName = "date.png" });
tableItems.Add(new TableItems("Flower Buds") { ImageName = "date.png" });
tableItems.Add(new TableItems("Legumes") { ImageName = "date.png" });
tableItems.Add(new TableItems("Bulbs") {ImageName = "date.png" });
tableItems.Add(new TableItems("Tubers") { ImageName = "date.png" });
table.Source = new TableSource(tableItems,_list);
}
}
}
This is table source class code.In this class i am getting null reference exception in Rowselected method
namespace PopulatingTableView {
public class TableSource : UITableViewSource {
List<TableItems> tableItems;
Listview parentcontroller ;
NSString cellIdentifier = new NSString("TableCell");
public event Action<int> OnRowSelect;
public TableSource ()
{
}
public TableSource (List<TableItems> items,Listview viewcontroller)
{
tableItems = items;
parentcontroller = viewcontroller;
}
public override void RowSelected (UITableView tableView, NSIndexPath indexPath)
{
// new UIAlertView("Row Selected", tableItems[indexPath.Row].Heading, null, "OK", null).Show();
parentcontroller.NavigationController.PushViewController (new _navigated_page(),true);
tableView.DeselectRow (indexPath, true);
}
public override nint RowsInSection (UITableView tableview, nint section)
{
return tableItems.Count;
}
public override UITableViewCell GetCell (UITableView tableView,NSIndexPath indexPath)
{
CustomVegeCell cell = tableView.DequeueReusableCell (cellIdentifier) as CustomVegeCell;
if (cell == null) {
cell = new CustomVegeCell (cellIdentifier);
}
cell.UpdateCell (UIImage.FromFile ("Images/" + tableItems [indexPath.Row].ImageName)
// , tableItems[indexPath.Row].SubHeading
,tableItems[indexPath.Row].Heading );
return cell;
}
}
}
And this is custom cells code.
namespace PopulatingTableView {
public class CustomVegeCell: UITableViewCell {
UILabel headingLabel; //subheadingLabel;
UIImageView imageView;
UIButton talk,date;
public CustomVegeCell (NSString cellId) : base (UITableViewCellStyle.Default, cellId)
{
SelectionStyle = UITableViewCellSelectionStyle.Gray;
ContentView.BackgroundColor = UIColor.White;
imageView = new UIImageView();
talk = new UIButton () {
Font = UIFont.FromName("Times New Roman", 10f),
BackgroundColor = UIColor.Orange,
};
date = new UIButton () {
Font = UIFont.FromName("Times New Roman", 10f),
BackgroundColor = UIColor.Green,
};
headingLabel = new UILabel () {
Font = UIFont.FromName("Times New Roman", 14f),
TextColor = UIColor.Black,
BackgroundColor = UIColor.Clear
};
ContentView.Add (headingLabel);
ContentView.Add (imageView);
ContentView.Add (talk);
ContentView.Add (date);
}
public void UpdateCell ( UIImage image,string caption)
{
imageView.Image = image;
headingLabel.Text = caption;
talk.SetTitle ("Talk", UIControlState.Normal);
talk.SetTitleColor (UIColor.White, UIControlState.Normal);
date.SetTitle ("Date", UIControlState.Normal);
date.SetTitleColor (UIColor.White, UIControlState.Normal);
}
public override void LayoutSubviews ()
{
base.LayoutSubviews ();
imageView.Frame = new RectangleF(5, 5, 33, 25);
headingLabel.Frame = new RectangleF(65, 5, 100, 25);
talk.Frame = new RectangleF(200, 8, 50, 25);
date.Frame = new RectangleF(260, 8, 50, 25);
}
}
}
This is the present uiviewcontroller code.When i trying to navigate from Listview.cs to _navigated_page.cs "nullreferenceexception" arised.Could anyone say what is problem with my code
namespace PopulatingTableView
{
partial class _navigated_page : UIViewController
{
UILabel label1,label2,label3;
public _navigated_page (IntPtr handle) : base (handle)
{
}
public _navigated_page()
{
}
public override void ViewDidLoad()
{
base.ViewDidLoad ();
var frame = new RectangleF(10, 60, 300, 110);
label1 = new UILabel(frame);
label1.Text = "New Label";
View.Add (label1);
var frame1 = new RectangleF(10, 90, 300, 110);
label2 = new UILabel(frame1);
label2.Text = "New Label";
View.Add (label2);
var frame2 = new RectangleF(10, 120, 300, 110);
label3 = new UILabel(frame2);
label3.Text = "New Label";
View.Add (label3);
}
}
}
Thanks in advance.
You never initialize _list, so you are always passing a null reference in your constructor:
table.Source = new TableSource(tableItems,_list);
Instead, do this:
table.Source = new TableSource(tableItems, this);

Upgrading custom view list mvvmcross touch

Hi I am trying to upgrade our ios app from mvvmcross v1 to v3. I can't figure out how to make my custom buttonrow work.
My view ViewDidLoad it is the button items that binds to the button row
public override void ViewDidLoad()
{
base.ViewDidLoad();
SortingView.ViewModel = ViewModel;
_shown = false;
// Setup View Animatons
Buttons.OnClick = () => { AnimationTransition = ViewTransitionAnimation.TransitionFade; };
TopRightButton.TouchDown +=
(sender, args) => {
AnimationTransition = ViewTransitionAnimation.TransitionCrossDissolve;
};
// Setup Bindings
this.AddBindings(
new Dictionary<object, string>
{
{this.BackgroundImage, "{'ImageData':{'Path':'BackgroundImage','Converter':'ImageItem'}}"},
{this.TopbarBackground, "{'ImageData':{'Path':'TopBarImage','Converter':'ImageItem'}}"},
{this.TopLogo, "{'ImageData':{'Path':'Logo','Converter':'ImageItem'}}"},
{this.Buttons, "{'ItemsSource':{'Path':'ButtonItems'}}"},
{this.SlideMenu, "{'ItemsSource':{'Path':'VisibleViews'}}"},
{
this.SortingView,
"{'ItemsSource':{'Path':'CategoriesName'},'SelectedGroups':{'Path':'SelectedGroups'},'ForceUbracoUpdateAction':{'Path':'ForceUbracoUpdateAction'}}"
},
{this.SettingsButton, "{'TouchDown':{'Path':'TopRightButtonClick'},'Hide':{'Path':'HideTopbarButton'},'ImageData':{'Path':'TopButtonImage','Converter':'ImageItem'}}" },
{this.TopRightButton, "{'TouchDown':{'Path':'SecondaryButtonButtonPushed'},'Hide':{'Path':'HideTopbarButton2'},'ImageData':{'Path':'SettingsButtonImage','Converter':'ImageItem'}}" }
});
// Perform any additional setup after loading the view, typically from a nib.
NSNotificationCenter.DefaultCenter.AddObserver(UIApplication.DidBecomeActiveNotification, ReEnableSlideMenu);
this.SortingView.Hidden=true;
ViewModel.SettingButtonEvent += HandleSettingButtonPushed;
}
Here is my custom control "ButtonRow
[Register("ButtonRow")]
public class ButtonRow : CustomListViewController
{
private int _width = 0;
private UIImage _backgroundImage = null;
public ButtonRow(IntPtr handle)
: base(handle)
{
_width = (int)this.Frame.Width;
UseImageAsIcon = false;
FontSize=0;
}
public bool UseImageAsIcon { get; set; }
public UIImage BackgroundImage
{
get { return _backgroundImage; }
set { _backgroundImage = value; }
}
public int FontSize
{
get;set;
}
private Action _onClickAction;
private int _spacing = 0;
public Action OnClick
{
get
{
return _onClickAction;
}
set
{
_onClickAction = value;
}
}
/// <summary>
/// The add views.
/// </summary>
/// custom implementation for adding views to the button row
protected override void AddViews()
{
if (ItemsSource == null)
{
Hidden = true;
return;
}
base.AddViews();
foreach (UIView uiView in Subviews)
{
uiView.RemoveFromSuperview();
}
if (ItemsSource.Count == 0)
{
Hidden = true;
return;
}
if (_backgroundImage != null)
{
var frame = new RectangleF(0, 0, Frame.Width, Frame.Height);
var background = new UIImageView(frame) { Image = _backgroundImage };
AddSubview(background);
}
_width = _width - ((ItemsSource.Count - 1) * Spacing);
var buttonWidth = (int)Math.Ceiling (((double)_width) / ItemsSource.Count);
int index = 0;
foreach (ViewItemModel item in ItemsSource)
{
// creating custom button with needed viewmodel, nib etc is loaded in the class constructor
var button = new ButtonWithLabel(item, OnClick);
if (FontSize > 0)
{
button.FontSize(FontSize);
}
if (UseImageAsIcon)
{
button.AddBindings(
new Dictionary<object, string>
{
{ button, "{'IconLabel':{'Path':'Title'},'TitleFontColor':{'Path':'TitleFontColor'}}" },
{ button.icon, "{'ImageData':{'Path':'ImageIcon','Converter':'ImageItem'}}" }
});
}
else
{
// bindings created between the button and its viewmodel
button.AddBindings(
new Dictionary<object, string>
{
{button, "{'Label':{'Path':'Title'},'TitleFontColor':{'Path':'TitleFontColor'},'BackgroundColor':{'Path':'BackgroundColor'}}" },
{button.Background, "{'ImageData':{'Path':'ImageIcon','Converter':'ImageItem'}}" }
});
button.icon.Hidden = true;
}
// new frame of button is set, as the number of buttons is dynamic
int x = index == 0 ? 0 : index * (buttonWidth + Spacing);
button.SetFrame(new RectangleF(x, 0, buttonWidth, Frame.Height));
// the view of the button is added to the buttonrow view
AddSubview(button.View);
index++;
}
}
public int Spacing
{
get
{
return this._spacing;
}
set
{
this._spacing = value;
}
}
protected override void Dispose(bool disposing)
{
base.Dispose(disposing);
}
public override void Cleanup()
{
if(Subviews!=null)
{
foreach (var view in Subviews)
{
view.RemoveFromSuperview();
}
}
if(_backgroundImage!=null)
{
_backgroundImage.Dispose();
}
ItemsSource = null;
}
}
Here is my CustomListViewController
public class CustomListViewController: UIView
{
private IList _itemsSource;
private CustomViewSource _viewSource;
public CustomListViewController(MvxShowViewModelRequest showRequest)
{
ShowRequest = showRequest;
}
protected CustomListViewController()
{
}
public CustomListViewController(IntPtr handle)
: base(handle)
{
}
public bool IsVisible
{
get
{
return this.IsVisible;
}
}
public IList ItemsSource
{
get { return _itemsSource; }
set { _itemsSource = value; if(value!=null){CreateViewSource(_itemsSource); }}
}
public virtual void CreateViewSource(IList items)
{
if (_viewSource == null)
{
_viewSource = new CustomViewSource();
_viewSource.OnNewViewsReady += FillViews;
}
_viewSource.ItemsSource = items;
}
private void FillViews(object sender, EventArgs e)
{
AddViews();
}
protected virtual void AddViews()
{
// get views from source and do custom allignment
}
public virtual void Cleanup()
{
if(_viewSource!=null)
{
_itemsSource.Clear();
_itemsSource=null;
_viewSource.OnNewViewsReady -= FillViews;
_viewSource.ItemsSource.Clear();
_viewSource.ItemsSource = null;
_viewSource=null;
}
}
public MvxShowViewModelRequest ShowRequest { get;
private set;
}
}
And My CustomViewSource
public class CustomViewSource
{
private IList _itemsSource;
private List<UIView> _views=new List<UIView>();
public event EventHandler<EventArgs> OnNewViewsReady;
public CustomViewSource ()
{
}
public List<UIView> Views { get { return _views; } }
public virtual IList ItemsSource
{
get { return _itemsSource; }
set
{
// if (_itemsSource == value)
// return;
var collectionChanged = _itemsSource as INotifyCollectionChanged;
if (collectionChanged != null)
collectionChanged.CollectionChanged -= CollectionChangedOnCollectionChanged;
_itemsSource = value;
collectionChanged = _itemsSource as INotifyCollectionChanged;
if (collectionChanged != null)
collectionChanged.CollectionChanged += CollectionChangedOnCollectionChanged;
ReloadViewData();
}
}
protected object GetItemAt(int position)
{
if (ItemsSource == null)
return null;
return ItemsSource[position];
}
protected void CollectionChangedOnCollectionChanged(object sender, NotifyCollectionChangedEventArgs notifyCollectionChangedEventArgs)
{
ReloadViewData();
}
protected virtual void ReloadViewData()
{
if(ItemsSource==null){return;}
foreach (var VARIABLE in ItemsSource)
{
//call create view and add it to Views
}
//event new views created
if(OnNewViewsReady!=null)
OnNewViewsReady(this,new EventArgs());
}
protected virtual UIView CreateUIView(int position)
{
UIView view = null;
/*
//create view from nib
UIView newView=null;
return newView;
* */
return view;
}
}
Any one have any clues on how to make this work in mvvmcross v3 ?
I would like to make it so i can add x number of buttons and load the buttons from nib files. Have looked at the Kittens collection view example, but have not figured out how to make it work for my buttonRow, not sure if the collectionView is the right one to use as base.
The most common way to show a list is to use a UITableView.
There are quite a few samples around that show how to load these in MvvmCross:
n=2 and n=2.5 in http://mvvmcross.wordpress.com/
n=6 and n=6.5 in http://mvvmcross.wordpress.com/
Working with Collections in https://github.com/MvvmCross/MvvmCross-Tutorials/tree/master/Working%20With%20Collections
In your case, it looks like the previous coder has implemented some sort of custom control with custom layout. Adapting this to v3 shouldn't be particularly difficult, but you are going to need to read through and understand the previous code and how it works (this is nothing to do with MvvmCross - it's just app UI code).
One sample on dealing with custom views like this in iOS is the N=32 tutorial - http://slodge.blogspot.co.uk/2013/06/n32-truth-about-viewmodels-starring.html

How to reflect changes in viewmodel to tableviewcell view with binding in MVVMcross

Am a little stuck with getting changes reflected from the ViewModel to the View when used in a MvxBindableTableViewCell. I am using the vNext branch of MvvmCross on iOS.
Everything is set up properly and the initial values are visible when loading/showing the list for the first time. The list is a ObservableCollection<T> and the ViewModels inherit from MvxViewModel (thus implements INotifyPropertyChanged).
The main ViewModel looks like this:
public abstract class BaseViewModel : MvxViewModel, IMvxServiceConsumer
{
//... just regular implementation
}
public class UploadListViewModel: BaseViewModel
{
private readonly IUploadItemTasks uploadItemTasks;
private readonly IPhotoPickerService photoPickerService;
public IObservableCollection<UploadItemViewModel> Uploads { get { return this.LoadUploadItems(); } }
public UploadListViewModel()
{
this.uploadItemTasks = this.GetService<IUploadItemTasks>();
this.photoPickerService = this.GetService<IPhotoPickerService>();
}
private IObservableCollection<UploadItemViewModel> LoadUploadItems()
{
using (var unitOfWork = UnitOfWork.Start ())
{
return new SimpleObservableCollection<UploadItemViewModel>(uploadItemTasks.GetAll());
}
}
public void StartUpload ()
{
if (this.Uploads == null || this.Uploads.Count == 0) {
ReportError("Error", "No images to upload");
return;
}
this.Uploads.ForEach (uploadItem => PostCallback (uploadItem));
}
private void PostCallback (UploadItemViewModel uploadAsset)
{
IProgressReporter progressReporter = uploadAsset;
this.photoPickerService.GetAssetFullImage(uploadAsset.ImageUrl,
(image) => {
UIImage fullImage = image;
NSData jpeg = fullImage.AsJPEG();
byte[] jpegBytes = new byte[jpeg.Length];
System.Runtime.InteropServices.Marshal.Copy(jpeg.Bytes, jpegBytes, 0, Convert.ToInt32(jpeg.Length));
MemoryStream stream = new MemoryStream(jpegBytes);
Uri destinationUrl = new Uri(uploadAsset.DestinationUrl + "&name=" + uploadAsset.Name + "&contentType=image%2FJPEG");
//TO DO: Move this to plugin
var uploader = new Uploader().UploadPicture (destinationUrl, stream, UploadComplete, progressReporter);
uploader.Host = uploadAsset.Host;
ThreadPool.QueueUserWorkItem (delegate {
uploader.Upload ();
jpeg = null;
});
});
}
private void UploadComplete (string name)
{
if (name == null){
ReportError("Error","There was an error uploading the media.");
} else
{
//ReportError("Succes", name);
}
}
The item ViewModel looks like:
public interface IProgressReporter
{
float Progress { get; set;}
}
public abstract class BaseAssetViewModel: BaseViewModel, IBaseAssetViewModel
{
//... just regular properties
}
public class UploadItemViewModel: BaseAssetViewModel, IProgressReporter
{
public UploadItemViewModel(): base()
{
}
private float progress;
public float Progress {
get {
return this.progress;
}
set {
this.progress = value;
this.RaisePropertyChanged(() => Progress);
}
}
}
The View for the items inherits from MvxBindableTableViewCell and has the property:
private float progress;
public float ProgressMarker {
get {
return progress;
}
set {
progress = value;
// change progressbar or textfield here
}
}
The tableviewcell is bounded to the UploadItemViewModel via the BindingText:
public const string BindingText = #"ProgressMarker Progress, Converter=Float;";
The Uploader class mentioned in the snippet of UploadListViewModel implements a private method which tries to set the progress on the IProgressReporter.
float progressValue;
void SetProgress (float newvalue)
{
progressValue = newvalue;
this.dispatcher.InvokeOnMainThread (delegate {
if (ProgressReporter != null)
ProgressReporter.Progress = progressValue;
});
}
During the first viewing of the list I can see that the properties in both the ViewModel and View are being hit but when I update the ViewModel via the interface IProgressReporter with a new value in Progress the View in the tableviewcell is not updated nor the property is being called.
What am I doing wrong or what am I missing here?
UPDATE: Check the answer to this question.
I found why the binding didn't work. I was replacing the ObservableCollection over and over again.. I changed that piece of code as stated below and now it reflects the changes made to the UploadItemViewModel in the View of the cell.
private IObservableCollection<UploadItemViewModel> uploads;
private IObservableCollection<UploadItemViewModel> LoadUploadItems()
{
if (uploads == null)
{
using (var unitOfWork = UnitOfWork.Start ())
{
uploads = new SimpleObservableCollection<UploadItemViewModel>(uploadItemTasks.FindAll());
}
}
return uploads;
}

View is not accessible after ParentViewController.View.AddSubview

I am using Monotouch to develop iPad app.
Here is my scenario:
I Created Tabbed base application.
e.g. Home, Admin, Reports....etc
Home tab is UIViewController.
I want three section inside Home Tab:
e.g. Category(Table view with navigation control (reason to use navigation because we have subcategories inside Category) beside Category Table, Items of selected category(Other Table view) and right hand side is detail view of Selected ITEM.
Here is what i did....
Dynamically create two tableview controller and added to main view controller.
HomeViewController.cs:
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
RootViewController rvc = new RootViewController("",UITableViewStyle.Grouped);
// navigation controller will manage the views displayed and provide navigation buttons
navigationController = new UINavigationController();
navigationController.PushViewController(rvc, false);
navigationController.TopViewController.Title ="Category";
navigationController.View.Frame = new RectangleF (0, 50, (50), (600));
// Main window to which we add the navigation controller to
this.View.AddSubview(navigationController.View);
itemtable.Delegate = new TableViewDelegate (list);
itemtable.DataSource = new TableViewDataSource (list);
// Perform any additional setup after loading the view, typically from a nib.
}
=====================================================
RootViewController:
using System;
using System.Collections.Generic;
using System.Linq;
using MonoTouch.Foundation;
using MonoTouch.UIKit;
using System.Drawing;
namespace DVPNTN_MobileApp
{
[MonoTouch.Foundation.Register("RootViewController")]
public partial class RootViewController : UITableViewController
{
public List<string> RootData = new List<string> { "Group1", "Group2" };
MonoTouch.UIKit.UINavigationController navigationControllerItem;
string SelectedGroup;
// Allow us to set the style of the TableView
public RootViewController(string selectedGroup, UITableViewStyle style) : base(style)
{
this.SelectedGroup = selectedGroup;
}
class DataSource : UITableViewDataSource
{
static NSString kCellIdentifier = new NSString ("MyIdentifier");
RootViewController tvc;
public DataSource (RootViewController tvc)
{
this.tvc = tvc;
}
public override int RowsInSection (UITableView tableView, int section)
{
return tvc.RootData.Count;
}
public override UITableViewCell GetCell (UITableView tableView, NSIndexPath indexPath)
{
var cell = tableView.DequeueReusableCell (kCellIdentifier);
if (cell == null)
{
cell = new UITableViewCell (UITableViewCellStyle.Default, kCellIdentifier);
}
cell.TextLabel.Text = tvc.RootData.ElementAt(indexPath.Row);
cell.Accessory = UITableViewCellAccessory.DetailDisclosureButton;
return cell;
}
}
class TableDelegate : UITableViewDelegate
{
RootViewController tvc;
SubGroupViewController sgvc;
public TableDelegate (RootViewController tvc)
{
this.tvc = tvc;
}
public override void RowSelected (UITableView tableView, NSIndexPath indexPath)
{
string selectedGroup = tvc.RootData.ElementAt(indexPath.Row);
sgvc = new SubGroupViewController(selectedGroup, UITableViewStyle.Grouped);
tvc.NavigationController.PushViewController(sgvc,true);
//tvc.View.RemoveFromSuperview();
//tvc.DidReceiveMemoryWarning();
GC.Collect();
}
}
public override void DidReceiveMemoryWarning ()
{
// Releases the view if it doesn't have a superview.
base.DidReceiveMemoryWarning ();
// Release any cached data, images, etc that aren't in use.
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
TableView.Delegate = new TableDelegate (this);
TableView.DataSource = new DataSource (this);
RootVIewItemController rvc1 = new RootVIewItemController(SelectedGroup,UITableViewStyle.Grouped);
// navigation controller will manage the views displayed and provide navigation buttons
navigationControllerItem = new UINavigationController();
navigationControllerItem.PushViewController(rvc1, false);
navigationControllerItem.TopViewController.Title = SelectedGroup + " " + "Item List";
navigationControllerItem.View.Frame = new RectangleF (0, 300, (50),(700));
//this.View.AddSubview(navigationControllerItem.View);
//rvc1.View.EnableInputClicksWhenVisible = true;
//this.ParentViewController.AddChildViewController(navigationControllerItem);
**> Problem is here --- subview is successfully added to parent view but it's not accessible, mean items are there but we can't touch cell or row???????**
ParentViewController.View.AddSubview(navigationControllerItem.View);
GC.Collect();
}
public override bool ShouldAutorotateToInterfaceOrientation (UIInterfaceOrientation toInterfaceOrientation)
{
// Return true for supported orientations
return true;
}
}
}
********** ItemViewController **
using System;
using System.Collections.Generic;
using System.Linq;
using MonoTouch.Foundation;
using MonoTouch.UIKit;
namespace DVPNTN_MobileApp
{
[MonoTouch.Foundation.Register("RootVIewItemController")]
public partial class RootVIewItemController : UITableViewController
{
public List<string> RootData = new List<string> { "Item 1", "Item 2", "Item 3", "Item 4" };
string SelectedGroup;
public RootVIewItemController (string selectedGroup, UITableViewStyle style) : base (style)
{
this.SelectedGroup = selectedGroup;
}
class DataSource : UITableViewDataSource
{
static NSString kCellIdentifier = new NSString ("MyIdentifier");
RootVIewItemController tvc;
public DataSource (RootVIewItemController tvc)
{
this.tvc = tvc;
}
public override int RowsInSection (UITableView tableView, int section)
{
return tvc.RootData.Count;
}
public override UITableViewCell GetCell (UITableView tableView, NSIndexPath indexPath)
{
var cell = tableView.DequeueReusableCell (kCellIdentifier);
if (cell == null)
{
cell = new UITableViewCell (UITableViewCellStyle.Default, kCellIdentifier);
}
cell.TextLabel.Text = tvc.RootData.ElementAt(indexPath.Row);
//cell.Accessory = UITableViewCellAccessory.DetailDisclosureButton;
return cell;
}
}
class TableDelegate : UITableViewDelegate
{
RootVIewItemController tvc;
SubGroupViewController sgvc;
public TableDelegate (RootVIewItemController tvc)
{
this.tvc = tvc;
}
public override void RowSelected (UITableView tableView, NSIndexPath indexPath)
{
string selectedGroup = tvc.RootData.ElementAt(indexPath.Row);
Console.WriteLine(
"TableViewDelegate.RowSelected: Label={0}",selectedGroup);
/*
if(sgvc == null)
sgvc = new SubGroupViewController(selectedGroup, UITableViewStyle.Grouped);
tvc.NavigationController.PushViewController(sgvc,true);*/
}
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
TableView.Delegate = new TableDelegate (this);
TableView.DataSource = new DataSource (this);
}
public override void DidReceiveMemoryWarning ()
{
// Releases the view if it doesn't have a superview.
base.DidReceiveMemoryWarning ();
// Release any cached data, images, etc that aren't in use.
}
}
}
Question:
Is it right way to doing this scenario?
It's work fine but when we add Item view to parent view controller it is not accessible, mean item list are there but cells are not accessible, we can't touch cell and raise even or do scrolling.
Please anybody can help me?
Thanks
I am not completely sure what you wanted to do. I took my best guess and created a sample with two solutions. One solution per tab. The first uses the built-in split view controller. I have read several places the UISplitViewController must be the root of the application. I have broke that rule by adding it as a child of the tab control.
The second creates a custom version of a split control.
using System;
using System.Collections.Generic;
using MonoTouch.Foundation;
using MonoTouch.UIKit;
using System.Drawing;
namespace delete04223
{
[Register ("AppDelegate")]
public partial class AppDelegate : UIApplicationDelegate
{
// class-level declarations
UIWindow window;
UITabBarController tabBarController;
public override bool FinishedLaunching (UIApplication app, NSDictionary options)
{
// create a new window instance based on the screen size
window = new UIWindow (UIScreen.MainScreen.Bounds);
var viewController1 = new MyUISplitViewController ();
var viewController2 = new MyUISplitViewController2 ();
tabBarController = new UITabBarController ();
tabBarController.ViewControllers = new UIViewController [] {
viewController1,
viewController2,
};
window.RootViewController = tabBarController;
// make the window visible
window.MakeKeyAndVisible ();
return true;
}
}
public class MyUISplitViewController : UISplitViewController
{
public MyUISplitViewController ()
{
this.Title = "Native Split View";
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
var viewController1 = new LeftViewController ();
var viewController2 = new DummyViewController ("Pane 1", "Pane 1");
this.ViewControllers = new UIViewController [] {viewController1, viewController2};
this.WeakDelegate = viewController2;
}
public override bool ShouldAutorotateToInterfaceOrientation (UIInterfaceOrientation toInterfaceOrientation)
{
return true;
}
}
public class MyUISplitViewController2 : UIViewController
{
public MyUISplitViewController2 ()
{
this.Title = "Custom Split View";
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
var viewController1 = new LeftViewController ();
var viewController2 = new DummyViewController ("Pane 1", "Pane 1");
this.AddChildViewController (viewController1);
this.AddChildViewController (viewController2);
this.View.AddSubview (viewController1.View);
this.View.AddSubview (viewController2.View);
}
public override void ViewDidLayoutSubviews ()
{
base.ViewDidLayoutSubviews ();
RectangleF lRect = this.View.Frame;
RectangleF rRect = lRect;
lRect.Width = .3f * lRect.Width;
rRect.X = lRect.Width + 1;
rRect.Width = (.7f * rRect.Width)-1;
this.View.Subviews[0].Frame = lRect;
this.View.Subviews[1].Frame = rRect;
}
public override bool ShouldAutorotateToInterfaceOrientation (UIInterfaceOrientation toInterfaceOrientation)
{
return true;
}
}
public class LeftViewController : UINavigationController
{
public LeftViewController ()
{
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
MyUITableViewController table = new MyUITableViewController (this);
this.PushViewController (table, false);
}
public override bool ShouldAutorotateToInterfaceOrientation (UIInterfaceOrientation toInterfaceOrientation)
{
return true;
}
public override UIViewController PopViewControllerAnimated (bool animated)
{
return base.PopViewControllerAnimated (true);
}
}
public class DummyViewController : UIViewController
{
string _myLabelText = "";
UIToolbar _toolbar;
public DummyViewController (string viewName, string labelText)
{
this.Title = viewName;
this._myLabelText = labelText;
this.View.BackgroundColor = UIColor.White;
}
public override bool ShouldAutorotateToInterfaceOrientation (UIInterfaceOrientation toInterfaceOrientation)
{
return true;
}
public override void ViewDidLoad ()
{
base.ViewDidLoad ();
float center = this.View.Frame.Width / 2f;
UILabel label = new UILabel (new RectangleF (center - 50, 100, 100, 40));
label.Text = this._myLabelText;
label.TextAlignment = UITextAlignment.Center;
label.AutoresizingMask = UIViewAutoresizing.FlexibleMargins;
RectangleF rect = this.View.Frame;
rect.Y = 0;
rect.Height = 44;
_toolbar = new UIToolbar (rect);
_toolbar.AutoresizingMask = UIViewAutoresizing.FlexibleWidth;
this.View.AddSubview (label);
this.View.AddSubview (_toolbar);
}
[Export("splitViewController:willHideViewController:withBarButtonItem:forPopoverController:")]
public void WillHideViewController (UISplitViewController svc, UIViewController vc,
UIBarButtonItem barButtonItem, UIPopoverController pc)
{
barButtonItem.Title = "Menu";
var items = new List<UIBarButtonItem> ();
items.Add (barButtonItem);
if (_toolbar.Items != null)
items.AddRange (_toolbar.Items);
_toolbar.SetItems (items.ToArray (), true);
//popoverController = pc;
}
[Export("splitViewController:willShowViewController:invalidatingBarButtonItem:")]
public void WillShowViewController (UISplitViewController svc, UIViewController vc,
UIBarButtonItem button)
{
// Called when the view is shown again in the split view, invalidating the button and popover controller.
var items = new List<UIBarButtonItem> (_toolbar.Items);
items.RemoveAt (0);
_toolbar.SetItems (items.ToArray (), true);
//popoverController = null;
}
}
internal class MyUITableViewController : UITableViewController
{
static NSString kCellIdentifier = new NSString ("MyIdentifier");
LeftViewController _parent;
public MyUITableViewController (LeftViewController parent) : base (UITableViewStyle.Plain)
{
this.TableView.WeakDelegate = this;
this.TableView.WeakDataSource = this;
this._parent = parent;
}
[Export ("tableView:numberOfRowsInSection:")]
public int RowsInSection (UITableView tableView, int section)
{
if (section == 0)
return 2;
return 3;
}
[Export ("tableView:cellForRowAtIndexPath:")]
public UITableViewCell GetCell (UITableView tableView, NSIndexPath indexPath)
{
var cell = tableView.DequeueReusableCell (kCellIdentifier);
if (cell == null)
{
cell = new UITableViewCell (UITableViewCellStyle.Default, kCellIdentifier);
}
cell.TextLabel.Text = GetRowName (indexPath);
return cell;
}
private string GetRowName (NSIndexPath indexPath)
{
string ret;
if (indexPath.Section == 0)
{
ret =
indexPath.Row == 0 ? "Row A" : "Row B";
}
else
{
ret =
indexPath.Row == 0 ? "Row D" :
indexPath.Row == 1 ? "Row E" : "Row F";
}
return ret;
}
[Export ("numberOfSectionsInTableView:")]
public int NumberOfSections (UITableView tableView)
{
return 2;
}
[Export ("tableView:titleForHeaderInSection:")]
public string TitleForHeader (UITableView tableView, int section)
{
if (section == 0)
return "One";
return "Two";
}
[Export ("tableView:didSelectRowAtIndexPath:")]
public virtual void RowSelected (UITableView tableView, NSIndexPath indexPath)
{
Console.WriteLine("Item Selected: Section={0}, Row={1}",indexPath.Section, indexPath.Row);
this._parent.PushViewController (new MySubUITableViewController (), true);
}
public override bool ShouldAutorotateToInterfaceOrientation (UIInterfaceOrientation toInterfaceOrientation)
{
return true;
}
}
internal class MySubUITableViewController : UITableViewController
{
static NSString kCellIdentifier = new NSString ("MyIdentifier");
static string [] _names = new string [] {"One", "Two", "Three", "Four", "Five"};
public MySubUITableViewController () : base (UITableViewStyle.Plain)
{
this.TableView.WeakDelegate = this;
this.TableView.WeakDataSource = this;
}
[Export ("tableView:numberOfRowsInSection:")]
public int RowsInSection (UITableView tableView, int section)
{
return 5;
}
[Export ("tableView:didSelectRowAtIndexPath:")]
public virtual void RowSelected (UITableView tableView, NSIndexPath indexPath)
{
Console.WriteLine("Item Selected: Section={0}, Row={1}",indexPath.Section, indexPath.Row);
}
[Export ("tableView:cellForRowAtIndexPath:")]
public UITableViewCell GetCell (UITableView tableView, NSIndexPath indexPath)
{
var cell = tableView.DequeueReusableCell (kCellIdentifier);
if (cell == null)
{
cell = new UITableViewCell (UITableViewCellStyle.Default, kCellIdentifier);
}
cell.TextLabel.Text = _names[indexPath.Row];
return cell;
}
public override bool ShouldAutorotateToInterfaceOrientation (UIInterfaceOrientation toInterfaceOrientation)
{
return true;
}
}
}

Resources