Is there a way to set the fonts when a Monotouch Dialog class has been instansiated?
[Section("This is the header")]
This will render with the default blue text with drop shadow, but I can't find where that font is being set. Is there a way to overwrite which font and color it uses?
I found a solution for those looking to replace ALL section headers in the entire solution. In MonoTouch.Dialog, there is a class named DialogViewController which is used when creating views with the reflection API. And in here, there's a method called GetViewForHeader(). Instead of sending back just the normal section.HeaderView, you can create a custom label and send that back.
public override UIView GetViewForHeader (UITableView tableView, int sectionIdx)
{
var section = Root.Sections [sectionIdx];
if (!string.IsNullOrEmpty(section.Caption))
{
var label = new UILabel();
label.BackgroundColor = UIColor.FromRGB(89, 41, 17);
label.TextColor = UIColor.FromRGB(255, 206, 52);
label.ShadowColor = UIColor.Black;
label.ShadowOffset = new SizeF(0, 1f);
label.Font = UIFont.FromName("TitlingGothicFB Cond", 20);
label.Text = section.Caption;
return label;
}
return section.HeaderView;
}
public override float GetHeightForHeader (UITableView tableView, int sectionIdx)
{
if (!string.IsNullOrEmpty(section.Caption))
return 40f;
return -1;
}
Remember to set the height, either manually or by getting the height from the label. You can also create a custom UIView, but a label was sufficient for me.
When you use the Section like that you will use the UITableView standard rendering.
The only way to change that is to use the Element API instead of the reflection API, and provide a UIView where you draw the contents of the data yourself.
Related
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.
}
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;
}
}
I am using MonoTouch.Dialog in my app; however, the form in question is implemented using a UIViewController to which which I added a TableView (so I can also add a UIToolbar).
I love the ImageLoader that comes in MonoTouch.Dialog.Utilities and am trying to use it in the GetCell() method of the DataSource for the TableView to render an image from a URL.
var callback = new ImageLoaderCallback(controller, cell.ImageView, indexPath); // ImageLoaderCallback implements IImageUpdated
cell.ImageView.Image = ImageLoader.DefaultRequestImage(new Uri(picFV.Value), callback);
The problem is that until the URL is downloaded, the space for the ImageView is collapsed (so that the text to the right of the image is actually anchored on the left of the table).
What I'd like to do is display a temporary local image which has the same dimensions as the downloaded image, so that when the ImageLoader is done retrieving and rendering the image, the user experience isn't as jarring.
I tried to do the following in the GetCell() call... cell.ImageView.Image is set to some other image (not shown below), and then I get a reference to what comes back from ImageLoader.DefaultRequestImage.
var image = ImageLoader.DefaultRequestImage(new Uri(picFV.Value), callback);
callback.Image = image;
the last line stuffs the image reference returned by ImageLoader into the callback's state, and the callback will replace the cell's ImageView.Image when the ImageLoader is done (see below):
// callback class for the MonoTouch.Dialog image loader utility
private class ImageLoaderCallback : IImageUpdated
{
private ListViewController controller;
private UIImageView imageView;
private NSIndexPath indexPath;
public ImageLoaderCallback(ListViewController c, UIImageView view, NSIndexPath path)
{
controller = c;
imageView = view;
indexPath = path;
}
public UIImage Image { get; set; }
void IImageUpdated.UpdatedImage(Uri uri)
{
if (uri == null)
return;
if (Image != null)
imageView.Image = Image;
// refresh the display for the row of the image that just got updated
controller.TableView.ReloadRows(new NSIndexPath [] { indexPath }, UITableViewRowAnimation.None);
}
}
However, this doesn't work because it appears that the ImageLoader needs to be "pulled" by the TableView when it tries to render its ImageView (i.e. the ImageLoader callback never gets invoked because no one is pulling on the URL).
How do I accomplish this scenario?
Thanks!
I know this is an old question now, but I came across it when searching for the same thing and have seen the following blog post which states how to accomplish this. I haven't yet tried it out but hopefully it might help you or anyone else coming across this in the future: http://yusinto.blogspot.co.uk/2012/05/background-image-downloading-with.html
Are there any existing extensions or is it fairly straight forward to add styles to RootElement in monotouch.dialog in a similar way you can style StyledStringElement.
Basically I would like to add an image, or badge to RootElement to indicate what sort of details would be in the child view, eg add Success, Warning, Error, Info type image - so the users may only be interested in clicking through to details that are not fully successful.
So ideally I would be able to code something like this...
UIImage imageSuccess = ImageLoader.DefaultRequestImage (new Uri ("file://" + Path.GetFullPath ("Images/Success.png")), null);
var root = new RootElement("Root") {
Image = imageSuccess,
Accessory = UITableViewCellAccessory.DetailDisclosureButton,
new Section (){
new BooleanElement ("Airplane Mode", false),
new RootElement ("Notifications") {
new Section (null, "Turn off Notifications")
{
new BooleanElement ("Notifications", false)
}
}}
};
Thanks for any help or pointers.
This question is old, but if anyone else comes across it you can subclass the RootElement class to add an icon. My code is as follows:
public class ImageRootElement : RootElement
{
private UIImage _image;
public override MonoTouch.UIKit.UITableViewCell GetCell (MonoTouch.UIKit.UITableView tv)
{
var baseCell = base.GetCell (tv);
var cell = new UITableViewCell (UITableViewCellStyle.Subtitle, "cellId");
cell.TextLabel.Text = Caption;
cell.Accessory = baseCell.Accessory;
cell.ImageView.Image = _image;
return cell;
}
public ImageRootElement (string caption, UIImage image) : base(caption)
{
_image = image;
}
}
Since MT.Dialog is open source, you can modify the RootElement properties and constructors however you like. I don't think there's anything that does what you want right out of the box, so you'll have to extend Dialog to meet your needs.
As an aside, it sounds like you MAY be misunderstanding the intent of RootElement. RootElement is simply the main container that all of your sections and elements are in. It doesn't seem to make sense to have a disclosure indicator or badge on a RootElement, simply because that is not the intent of RootElement. It's possible that I could just be misunderstanding you. If, however, you want to do custom styling with badges, etc, on an element, you can create custom element classes that inherit from OwnerDrawnElement, overriding it's two abstract methods. However, read Miguel's answer to a similar question here before doing so.
I'm trying to figure out how to have a view. Let's call it ThirdView. It should slide up from the bottom of the screen when a user clicks a particular button on SecondView.
You'll want to create the ThirdView in your SecondView and present it as a modal view, passing in the secondView in the constructor. This will be the easiest way of animating it in the way you would like.
var thirdView = new ThirdView(secondView);
this.PresentModalViewController(thirdView, true);
In your third view, you'll want to call the passed-in SecondView and call:
secondView.DismissModalViewControllerAnimated(true);
Here is a complete working example. It is a tad simpler than in chrisntr's answer...though the above example is what I used to figure everything out.
The coolest thing about this method is that for an artistic custom UI (like the one I am building for a game), there is no off-the-shelf UI elements like the TabBar, Navigation bars, etc. The most creative applications don't use standard UI stuff.
In your main.cs file, in your finishedlaunching block:
ViewController myUIV = new ViewController();
window.AddSubview(myUIV.View);
window.MakeKeyAndVisble();
And then in a new code file add this code:
using System;
using System.Drawing;
using MonoTouch.UIKit;
namespace AnimationTest
{
public class ViewController : UIViewController
{
UIButton uib = new UIButton(new RectangleF(100, 100, 40, 40));
public override void ViewDidLoad()
{
Console.WriteLine("UI1");
this.View.BackgroundColor = UIColor.Blue;
uib.BackgroundColor = UIColor.White;
uib.TouchUpInside += delegate {
Console.WriteLine("Hey!");
var vc2 = new SecondController();
PresentModalViewController(vc2, true);
};
this.View.AddSubview(uib);
base.ViewDidLoad();
}
}
public class SecondController : UIViewController
{
UIButton uib = new UIButton(new RectangleF(100, 100, 40, 40));
public override void ViewDidLoad()
{
this.View.BackgroundColor = UIColor.White;
uib.BackgroundColor = UIColor.Red;
uib.TouchUpInside += delegate {
this.DismissModalViewControllerAnimated(true);
};
this.View.AddSubview(uib);
base.ViewDidLoad();
}
}