Adding a background image to monotouch.dialog mode

Question

I am trying to create an application using MonoTouch and MonoTouch.Dialog.

I really like the way Dropbox designed their welcome look. When the application is opened for the first time, you are presented with a screen, for example

Similar to what I need to do. First I need to check if my user is new to the product or already has an account.

Their welcome screen looks like a navigation controller to me (sorry if I'm wrong)

I want to add my business logo to a dropboxes-like view and add navigation buttons at the bottom of the view

Can MonoTouch.Dialog do something like this?

Answer 1

I think Anuj answered most of them - except for the logo part. You probably need a nice gradient-like background as it suggests (and should get a loan ;-).

From there, it might be easier to create a transparent (background) logo and add it over the background. To do this, you can add UIImage to the TableView inside the DialogViewController that you will use.

There are many other ways to do this. This ensures that your MTD elements are only shown under the TableHeaderView where your logo is located.

Here is a quick (and very dirty) code sample for adding an image to the header:

  public override bool FinishedLaunching (UIApplication app, NSDictionary options) { var root = new RootElement ("Welcome to MonoTouch") { new Section (String.Empty) { new StyledStringElement ("I'm already a MonoTouch user") { Accessory = UITableViewCellAccessory.DisclosureIndicator }, new StyledStringElement ("I'm new to MonoTouch") { Accessory = UITableViewCellAccessory.DisclosureIndicator } } }; var dv = new DialogViewController (root) { Autorotate = true }; var data = NSData.FromUrl (new NSUrl ("https://github.com/xamarin/monotouch-samples/blob/master/AVCaptureFrames/Images/Icons/114_icon.png?raw=true")); var logo = UIImage.LoadFromData (data); dv.TableView.TableHeaderView = new UIImageView (logo); navigation.PushViewController (dv, true); window.MakeKeyAndVisible (); // On iOS5 we use the new window.RootViewController, on older versions, we add the subview if (UIDevice.CurrentDevice.CheckSystemVersion (5, 0)) window.RootViewController = navigation; else window.AddSubview (navigation.View); return true; } 

Answer 2

In general, complex background views should be specified by adding UIImageVIew as a subtask. Otherwise, in the case of Dropbox, they use a repeating image of the template:

 public class MyDialogViewController : DialogViewController { public MyDialogViewController (RootElement root) : base (root) { } public override void LoadView () { base.LoadView (); this.TableView.BackgroundColor = UIColor.Clear; var background = UIImage.FromFile ("background.png"); ParentViewController.View.BackgroundColor = UIColor.FromPatternImage(background); }