Applying a style to an iOS custom renderer in Xamarin.Forms - xamarin

I'm developing a simple Xamarin.Forms app and I have created custom Entry renderers for Android and UWP.
I have successfully applied my own custom styles to the Entry renderers like so :
For UWP
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
var customControl = e.NewElement;
var nativeControl = new FormsTextBox();
var style = Windows.UI.Xaml.Application.Current.Resources["UserNameEntry"] as Windows.UI.Xaml.Style;
nativeControl.Style = style;
nativeControl.PlaceholderText = customControl.Placeholder;
SetNativeControl(nativeControl);
}
For Android
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (e.OldElement == null)
{
var nativeEditText = (global::Android.Widget.EditText)Control;
nativeEditText.SetBackground(Resources.GetDrawable("#drawable/username"));
}
}
So, it is dead simple to apply any custom style by using the native styling tools from Android and UWP platforms.
My question is, is there any way to do the same with iOS? How can I apply a style using a description-based file like a style.xaml in UWP or style.axml in Android?

You can do for IOS like this :
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.BorderStyle = UITextBorderStyle.None;
UIImage img = UIImage.FromFile("ImageName.png");
Control.Background = img;
}
}

Related

Xamarin Native map point open infowindow by default

Im loading a native map application (android,IOS) with a custom pin location and with a custom marker.What i need is when i load the map i need to open the map pin marker info window by default.
currently what is happening is when user tap the pin info then only the pin info window shows up.
I have seen some code there markerOpt1.showInfoWindow() there is no method like this.
As per the documentation i know only one info window can pops up.In my scenario only one pin is there
Android implementation
public void OnMapReady(GoogleMap map)
{
MarkerOptions markerOpt1 = new MarkerOptions();
markerOpt1.SetPosition(new LatLng(50.379444, 2.773611));
markerOpt1.SetTitle("Vimy Ridge");
var bmDescriptor = BitmapDescriptorFactory.DefaultMarker (BitmapDescriptorFactory.HueCyan);
markerOpt1.InvokeIcon(bmDescriptor);
map.AddMarker(markerOpt1);
}
I have write custom renders for Android native application markers and ios mkmapview how can i show up the information view when loading the map
Here is the official sample of customrenderers-map-pin, to open infowindow by default,
In iOS:
protected override void OnElementChanged(ElementChangedEventArgs<View> e)
{
base.OnElementChanged(e);
//...
if (e.NewElement != null)
{
var formsMap = (CustomMap)e.NewElement;
var nativeMap = Control as MKMapView;
customPins = formsMap.CustomPins;
//...
//add MapLoaded Event
nativeMap.MapLoaded += NativeMap_MapLoaded;
}
}
And in NativeMap_MapLoaded:
private void NativeMap_MapLoaded(object sender, EventArgs e)
{
annotationView.SetSelected(true,true);
}
In Android, try this:
protected override void OnMapReady(GoogleMap map)
{
base.OnMapReady(map);
MarkerOptions markerOpt1 = new MarkerOptions();
markerOpt1.SetPosition(new LatLng(50.379444, 2.773611));
markerOpt1.SetTitle("Vimy Ridge");
var bmDescriptor = BitmapDescriptorFactory.DefaultMarker(BitmapDescriptorFactory.HueCyan);
Marker marker = map.AddMarker(markerOpt1);
marker.ShowInfoWindow();
}

How to hide scrollbar in listview in xamarin forms

I want to hide listview scrollbar in my xamarin andorid and xamarin ios application's. I have searched many post's but only few post's are having the helpful that to not clear. Please suggest any idea of hide scrollbar in listview.
Here is what I did:
Android custom renderer:
[assembly: ExportRenderer(typeof(CustomListView),typeof(CustomListViewRenderer))]
namespace ImageList.Droid
{
public class CustomListViewRenderer : ListViewRenderer
{
protected override void OnElementChanged(ElementChangedEventArgs<ListView> e)
{
base.OnElementChanged(e);
if(Control != null)
{
Control.VerticalScrollBarEnabled = false;
}
}
}
}
iOS custom renderer:
[assembly: ExportRenderer(typeof(CustomListView), typeof(CustomListViewRenderer))]
namespace ImageList.iOS
{
public class CustomListViewRenderer : ListViewRenderer
{
protected override void OnElementChanged(ElementChangedEventArgs<ListView> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.ShowsVerticalScrollIndicator = false;
}
}
}
}
Remember: We need to use the Custom ListView instead of the native ListView in the PCL Forms
Update: Now from Xamarin.Forms version 3.5.0, we can use VerticalScrollBarVisibility, HorizontalScrollBarVisibility properties to handle ListView ScrollBarVisibility.
You can also find full source code and document from http://bsubramanyamraju.blogspot.com/2019/03/hide-listview-scrollbar-in-xamarinforms.html
Custom renders for the solution here, check official documents for that
https://developer.xamarin.com/guides/xamarin-forms/application-fundamentals/custom-renderer/listview/
Android:
ListView.VericalScrollbarEnabled = false;
iOS:
UIScrollView.ShowsVerticalScrollIndicator = false;

I want to add my own image to switch Control in ios using Xamarin forms

I tried to add my own image to switch Control in xamarin forms using rendering concept but i am unable to override the existing image.Below is my code.
In shared project i added code like this
Switch switcher = new ExtendedSwitchnew();
and in ios
[assembly: ExportRenderer(typeof(ExtendedSwitchnew),typeof(SwitchRenderernew))]
namespace test.iOS
{
public class SwitchRenderernew :SwitchRenderer
{
protected override void OnElementChanged(ElementChangedEventArgs<Switch> e)
{
base.OnElementChanged(e);
if (Control != null)
{
UIImage imgon = UIImage.FromFile("Images/switchon.png");
UIImage imgoff = UIImage.FromFile("Images/switchoff.png");
Control.OnImage = imgon;
Control.OffImage = imgoff;
}
}
}
}
Help me.Thanks in advace.

How to use Android AutoCompleteTextView on Xamarin.Forms

I'm working on a Xamarin.forms project but i need to use Android.Widget.AutoCompleteTextView how can i apply that?
When i am trying to add AutoCompleteTextView UserNameAutoComplete; to ContentPage i get the following error:
Content = new StackLayout
{
VerticalOptions = LayoutOptions.Center,
Padding = new Thickness(25),
Children =
{
UserNameAutoComplete,
passwordEditor,
}
};
cannot convert from 'Android.Widget.AutoCompleteTextView' to
'Xamarin.Forms.View'
Android.Widget.AutoCompleteTextView is a View from Android.
Solution for PCL:
You can't use platform specific View's on Xamarin Forms (PCL) ContentPage.
To use platform specific View you should use a custom render.
There is a blog post from #JamesMontemagno that shows how to do what you need.
This code is draft exemple please use it as such.
1 - Create your own custom Xamarin.Forms control that will be renderered in Android as an AutoCompleteTextView:
public class AutoCompleteView : View
{
// Place need properties here.
}
2 - In Android project add a renderer for AutoCompleteView:
[assembly: ExportRenderer(typeof(AutoCompleteView), typeof(AutoCompleteViewRenderer))]
namespace App.Droid
{
public class AutoCompleteViewRenderer : ViewRenderer<AutoCompleteView, AutoCompleteTextView>
{
// Initialize the AutoCompleteTextView
protected override void OnElementChanged (ElementChangedEventArgs<AutoComplete> e)
{
base.OnElementChanged (e);
if (e.OldElement != null || this.Element == null)
return;
var autoComplete = new AutoCompleteTextView(Forms.Context);
SetNativeControl (autoComplete);
}
// Use the control here.
protected override void OnElementPropertyChanged (object sender, PropertyChangedEventArgs e) {
base.OnElementPropertyChanged (sender, e);
if (this.Element == null || this.Control == null)
return;
// variable this.Control is the AutoCompleteTextView, so you an manipulate it.
}
}
}
Solution for Shared Project:
When using Shared Project there is a possibility to use Native Embedding, like:
...
var textView = new TextView (Forms.Context) { Text = originalText };
stackLayout.Children.Add (textView);
contentView.Content = textView.ToView();
...

Xamarin Forms WinRT Entry Custom Renderer

I am trying to have make the Entry select all text when it is focused. I have a custom renderer for doing so on Android, but would like it to work on Windows 8 as well. How can I create a custom render for Windows in Xamarin Forms? Here is what I have:
[assembly: ExportRenderer(typeof(Xamarin.Forms.Entry), typeof(DrivingLog.Windows.MyEntryRenderer))]
namespace DrivingLog.Windows{
public class MyEntryRenderer : EntryRenderer {
protected override void OnElementChanged(ElementChangedEventArgs e) {
base.OnElementChanged(e);
if (e.OldElement == null) {
var nativeEditText = (global::Windows.UI.Xaml.Controls.TextBox)Control;
nativeEditText.ManipulationStarted += (object sender, ManipulationStartedRoutedEventArgs args) => {
nativeEditText.SelectAll();
};
}
}
}
}
I found the issue, the renderer class was in the Main Page.xaml.cs file. It needed to be in a file that did not have xaml associated with it for the assembly tag to be recognized be Xamarin Forms 2.0

Resources