tint2 ToolbarItem/Button size - node.js

I'm using Tint2 to create a desktop application. I want to use the native toolbar capability, button when I add a ToolbarItem (docs) to the toolbar, it simply doesn't show up:
var toolbar = new Toolbar();
var new_button = new ToolbarItem();
new_button.title = 'Hello';
new_button.enabled = true;
toolbar.appendChild(new_button);
win.toolbar = toolbar;
Similarly, I tried just using a Button (docs) instead of a ToolbarItem (the latter is recommended in the docs). This results in a very small button - the width property is ignored:
var toolbar = new Toolbar();
var new_button = new Button();
new_button.title = 'Hello';
new_button.width = '150px';
toolbar.appendChild(new_button);
win.toolbar = toolbar;

If you notice on the Toolbar class that there's a property called 'state', it sets what type of display the toolbar uses. Users can set various preferences as to whether they want to see images, labels or images or labels.
My guess is its default is "image only" and the label isn't used.
var toolbar = new Toolbar();
var new_button = new ToolbarItem();
new_button.title = 'Hello';
new_button.width = '150px';
toolbar.state = 'label'; // THIS LINE IS IMPORTANT FOR NO IMAGE TOOLBARS.
toolbar.appendChild(new_button);
win.toolbar = toolbar;
The second issue you're seeing is the toolbar dictating the width of something. Using your own width may or may not be respected on the toolbar. You can always just place the button directly within the window and skip the toolbar entirely.
var new_button = new Button();
new_button.title = 'Hello';
new_button.width = '150px';
new_button.left = '20px';
new_button.top = '20px';
win.appendChild(new_button);

Related

iOS 13 Changes to UISearchBar tint's, can't achieve the same outcome

I've been experimenting all day and trying to figure out just how to get my UISearchBar to appear the same in iOS13 as it appears in iOS12/11
So the way the search bar is added is simply a new UISearchController.
var searchController = new UISearchController(searchResultsController: null);
searchController.SearchBar.Placeholder = "Search";
searchController.SearchResultsUpdater = this;
searchController.HidesNavigationBarDuringPresentation = false;
searchController.DimsBackgroundDuringPresentation = false;
NavigationItem.SearchController = searchController;
NavigationItem.HidesSearchBarWhenScrolling = false;
The results on iOS 11/12:
The results on iOS 13:
On iOS 13 I am using the new UINavigationBarAppearance code like this:
var appearance = new UINavigationBarAppearance();
appearance.ConfigureWithOpaqueBackground();
appearance.BackgroundColor = ColorPalette.TintColor;
appearance.TitleTextAttributes = new UIStringAttributes { ForegroundColor = UIColor.White };
NavigationItem.StandardAppearance = appearance;
On iOS 11/12 I am using legacy way to achieve it:
NavigationController.NavigationBar.BarStyle = UIBarStyle.Black;
NavigationController.NavigationBar.TintColor = UIColor.White;
NavigationController.NavigationBar.BarTintColor = ColorPalette.TintColor;
NavigationController.NavigationBar.Translucent = false;
I've tried a number of things, but can't seem to get the UISearchBar to tint by itself how iOS11/12 achieves it.
I know that the new UISearchBar now has access to the UITextField and I can configure the background color's etc.
searchBar.setSearchFieldBackgroundImage(UIImage(), for: .normal)
The code above has a side effect which removes corner radius of the text field.
Extension
extension UISearchBar {
  /// This solves iOS 13 issue which is a light gray overay covers the textField.
  /// - Parameter color: A color for searchField
  func setSearchFieldBackgroundColor(_ color: UIColor) {
    searchTextField.backgroundColor = color
    setSearchFieldBackgroundImage(UIImage(), for: .normal)
    // Make up the default cornerRadius changed by `setSearchFieldBackgroundImage(_:for:)`
    searchTextField.layer.cornerRadius = 10
    searchTextField.clipsToBounds = true
  }
}
There were several properties added in iOS 13, so you need to use them with the help of a conditional. For changing the background color, you have to use the BackgroundColor property of the SearchBar, like this
searchController.SearchBar.BackgroundColor = UIColor.Red;
Use a custom renderer and override the OnElementChanged method this way
protected override void OnElementChanged(ElementChangedEventArgs<SearchBar> e)
{
base.OnElementChanged(e);
if (Control != null)
{
if(UIDevice.CurrentDevice.CheckSystemVersion(13,0))
Control.SearchTextField.BackgroundColor = Element.BackgroundColor.ToUIColor();
}
}
later on, you don't have to do anything else and worked for me on ios 12 and ios 13+
On iOS 13, you have access to the internal UISearchTextField through the SearchTextField property, you can set it's background directly (in my case, I need the background to be white). Be sure to check the iOS version to avoid exceptions.
if(UIDevice.CurrentDevice.CheckSystemVersion(13,0))
{
searchController.SearchBar.SearchTextField.BackgroundColor = UIColor.White;
}
You can achieve desired result by adding couple of lines.
searchBar.barTintColor = UIColor.red
searchBar.searchTextField.backgroundColor = UIColor.white
Before you try this code please link IB Outlets for searchBar
#IBOutlet weak var searchBar: UISearchBar!

Xamarin.Forms Action Bar - Center Aligned Image

Using Xamarin.Forms, how do I get the same effect as the application pictured below, specifically to show a centred image on the Action Bar / page tool bar (the section in a blue box)?
I would like to have a long width image in that section, and the solution must work for Android, iOS, Windows Phone, and Universal Windows (even if it means writing custom renderers or platform specific xamarin code).
I suggest you create your own Xamarin.Forms view and handle the navigation by yourself something similar to this:
public class CustomBackNavigationBar : StackLayout
{
public Image BackIcon;
public Image Icon;
public Label IconTitle;
public StackLayout IconContainer;
public CustomBackNavigationBar(string title, string icon)
{
Padding = new Thickness(15,5);
HeightRequest = 40;
Orientation = StackOrientation.Horizontal;
VerticalOptions = LayoutOptions.Start;
BackgroundColor = StaticData.BlueColor;
Spacing = 15;
BackIcon = new Image
{
Source = StaticData.BackIcon,
HorizontalOptions = LayoutOptions.Start
};
Label Title = new Label
{
Text = title,
TextColor = Color.White,
FontSize = Device.GetNamedSize(NamedSize.Default, typeof(Label)),
FontAttributes = FontAttributes.Bold,
VerticalTextAlignment = TextAlignment.Center
};
Icon = new Image
{
Source = icon
};
IconTitle = new Label
{
Text = StaticData.CallAgent,
TextColor = Color.White,
FontSize = Device.GetNamedSize(NamedSize.Micro, typeof(Label)),
};
IconContainer = new StackLayout
{
HorizontalOptions = LayoutOptions.EndAndExpand,
Spacing = 2,
Children = { Icon, IconTitle }
};
Children.Add(BackIcon);
Children.Add(Title);
Children.Add(IconContainer);
#region Events
BackIcon.GestureRecognizers.Clear();
BackIcon.GestureRecognizers.Add(new TapGestureRecognizer
{
Command = new Command(PopAsync)
});
#endregion
}
async void PopAsync()
{
await App.AppNavigation.PopAsync();
}
}

How to get drives( 'C' or 'E' or 'F' )available in a system?

I am developing an Bootstrapper application. When we move to the installation location selection wizard, we can have a browse option to change the location of our setup installation.
When we clock that browse option, i need to show only the drives( 'C', 'D' and 'F') available in a system. When we select the drive, it will not expand. i need that drive alone (Ex: C:) in the installation location text in the installation wizard.
Can anyone please guide me that how to achieve my requirement?
My code:
private void btn_Browse_Click(object sender, EventArgs e)
{
txt_InstallLocation.Focus();
FBD_Source.RootFolder = Environment.SpecialFolder.Desktop;
if (FBD_Source.ShowDialog() == DialogResult.OK)
{
txt_InstallLocation.TextBox.Text = FBD_Source.SelectedPath;
BA.Model.Bootstrapper.Engine.StringVariables["APPDIR"] = FBD_Source.SelectedPath + "\\";
}
}
I need to modify the below line of code.
FBD_Source.RootFolder = Environment.SpecialFolder.Desktop;
Can anyone please assist me to proceed further or direct me in right path?
Your can find the available drives like this.
var drives = System.Environment.GetLogicalDrives();
foreach (string d in drives)
Console.WriteLine(d);
Don't use the FolderBrowserDialog.
Create a form with a dynamically created radiobutton/list and make the user select one of those options
Something like this
var drives = System.Environment.GetLogicalDrives();
Form selectionForm = new Form() { MaximizeBox = false, FormBorderStyle = System.Windows.Forms.FormBorderStyle.FixedDialog, StartPosition = FormStartPosition.CenterScreen };
ListBox lb = new ListBox() { Dock = DockStyle.Fill };
foreach (var item in drives)
lb.Items.Add(item);
selectionForm.Controls.Add(lb);
Button btnOk = new Button() { Dock = DockStyle.Left, Width = selectionForm.Width / 2 };
btnOk.Text = "OK";
Button btnCancel = new Button() { Dock = DockStyle.Right, Width = selectionForm.Width / 2 };
btnCancel.Text = "Cancel";
Panel bottomPanel = new Panel() { Dock = DockStyle.Bottom, Height = 50 };
bottomPanel.Controls.Add(btnOk);
bottomPanel.Controls.Add(btnCancel);
selectionForm.Controls.Add(bottomPanel);
selectionForm.ShowDialog();
MessageBox.Show(lb.SelectedItem.ToString());

UINavigationBar in a UIPopoverController looks ugly if created programatically

I want to open a Popover in code after a specific action happens (e.g. tap on a button).
The following Code let me open a Popover with a NavigationBar but it don't looks like the one I've done with IB. (IB approach was embedding a UIViewController in a UINavigationController and defining the the two buttons cancel and save). The only thing I want is having these two buttons on top of the Popover. I don't use any navigation functionality!
var cell = grid.VisibleCellAtCoordinate(coordinate) as SDataGridTextCell;
var viewController = new UIViewController();
var navBar = new UINavigationBar(new RectangleF(0, 0, viewController.View.Bounds.Width, 50))
{
AutoresizingMask = UIViewAutoresizing.FlexibleWidth,
BarStyle = UIBarStyle.Black,
Translucent = true,
Items = new[]
{
new UINavigationItem("test")
{
LeftBarButtonItem = new UIBarButtonItem(UIBarButtonSystemItem.Cancel, (s, e) => { _popoverController.Dismiss(true); }),
RightBarButtonItem = new UIBarButtonItem(UIBarButtonSystemItem.Save, (s, e) => { _popoverController.Dismiss(true); })
}
}
};
var textField = new UITextField(new RectangleF(0, 50, viewController.View.Bounds.Width, viewController.View.Bounds.Height)) { Placeholder = "Mein Text...", BackgroundColor = UIColor.White };
textField.BecomeFirstResponder();
viewController.View.Add(navBar);
viewController.View.Add(textField);
viewController.View.SubviewAdded(textField);
_popoverController = new UIPopoverController(viewController);
_popoverController.SetPopoverContentSize(new SizeF(250, 200), false);
_popoverController.PresentFromRect(cell.Bounds, cell, UIPopoverArrowDirection.Any, false);
These buttons looks like this image (ugly):
And this image shows how it's look like when created in IB:
That's one of the caveats of using a standalone navigation bar in a popover. Embedding your view controller in a navigation controller is, as far as I know, the only way to avoid it.
Had some problem embedding the content view (UIViewController) correctly to the UINavigationController because I tried to add the navigation bar items (buttons) each time directly to the UINavigationController's NavigationItem property. But this must be done through the content view controller...
var contentViewController = new UIViewController();
var textField = new UITextField(contentViewController.View.Bounds)
{
BackgroundColor = UIColor.White,
AutoresizingMask = ~UIViewAutoresizing.None,
Placeholder = "My Text..."
};
contentViewController.View.Add(textField);
var navigationController = new UINavigationController(contentViewController);
contentViewController.Title = "Popover";
contentViewController.NavigationItem.LeftBarButtonItem = new UIBarButtonItem(UIBarButtonSystemItem.Cancel, (s, e) => { _popoverController.Dismiss(false); });
contentViewController.NavigationItem.RightBarButtonItem = new UIBarButtonItem(UIBarButtonSystemItem.Save, (s, e) => { _popoverController.Dismiss(false); });
_popoverController = new UIPopoverController(navigationController);
_popoverController.SetPopoverContentSize(new SizeF(300, 300), false);
_popoverController.PresentFromRect(button1.Bounds, button1, UIPopoverArrowDirection.Any, false);

Monotouch.Dialog StyledStringElement delegate always fires for the last element added

given the following code, I am having an issue when clicking on each element. If we assume I have 5 exercises and therefore create 5 elements in the foreach() loop, when the table is rendered and I click on any element, the delegate always gets the exercise of the 5th (last) element.
The elements are displayed properly, each showing the associated exercise's name. It is just the delegate that does not work as expected.
If I do not use a foreach loop and hardcode each element instead it works as expected. However if I cannot dynamically populate the dialogViewController and use the element tapped event for each one, is not good.
private void CreateExerciseTable()
{
Section section = new Section();
foreach (var exercise in exercises)
{
var element = new StyledStringElement(exercise.ExerciseName,
delegate { AddExercise(exercise); })
{
Font = Fonts.H3,
TextColor = UIColor.White,
BackgroundColor = RGBColors.LightBlue,
Accessory = UITableViewCellAccessory.DisclosureIndicator
};
section.Elements.Add(element);
}
var root = new RootElement("Selection") {
section
};
var dv = new DialogViewController(root, true);
dv.Style = UITableViewStyle.Plain;
//Remove the extra blank table lines from the bottom of the table.
UIView footer = new UIView(new System.Drawing.RectangleF(0,0,0,0));
dv.TableView.TableFooterView = footer;
dv.TableView.SeparatorColor = UIColor.White;
dv.TableView.BackgroundColor = UIColor.White;
tableFitnessExercises.AddSubview(dv.View);
}
private void AddExercise(FitnessExercise exercise)
{
NavigationManager.FitnessRoutine.Add(exercise);
PerformSegue(UIIdentifierConstants.SegAddExerciseToFitnessRoutine, this);
}
This is a classic closure bug!
The problem is that you are accessing the loop reference.
Try:
foreach (var exercise in exercises)
{
var localRef = exercise;
var element = new StyledStringElement(exercise.ExerciseName,
delegate { AddExercise(localRef); })
{
Font = Fonts.H3,
TextColor = UIColor.White,
BackgroundColor = RGBColors.LightBlue,
Accessory = UITableViewCellAccessory.DisclosureIndicator
};
section.Elements.Add(element);
}
For more on this see http://blogs.msdn.com/b/ericlippert/archive/2009/11/12/closing-over-the-loop-variable-considered-harmful.aspx

Resources