How to assign Background Image to an entry in xamarin forms for ios - xamarin

I am trying to add background image to an entry in xamarin forms and i wrote code for rendering in ios and android. For android it is working and for ios it is not working.
Here I am sharing rendering code for ios:
[assembly: ExportRenderer (typeof(ExtendedUsername), typeof(RenderingEntryuname))]
namespace ifind.iOS
{
public class RenderingEntryuname: EntryRenderer
{
// Override the OnElementChanged method so we can tweak this renderer post-initial setup
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (Control != null) {
Control.TextAlignment=UITextAlignment.Center;
UIImage img=UIImage.FromFile("Images/newimg.jpg");
Control.Background=img
}
}
}
}

By default the UITextEntry used for a Forms Entry will have its border style set to UITextBorderStyle.RoundedRect and thus any background will be ignored.
Set the border style to none and your image will show up:
if (Control != null) {
Control.BorderStyle = UITextBorderStyle.None;
Control.TextAlignment=UITextAlignment.Center;
UIImage img=UIImage.FromFile("Images/newimg.jpg");
Control.Background=img
}
If the value is set to the UITextBorderStyleRoundedRect style, the custom background image associated with the text field is ignored.
Ref: UITextField

Related

Custom switch does not show On/Off Image in Xamarin Forms

https://www.c-sharpcorner.com/article/how-to-create-and-use-a-custom-switch-control-in-xamarin-forms/
"OnImage" and "OffImage" does not work when i make a custom renderer following the guide above. I see no image when i click on or off.
In my class, I send in a HTTP url and then convert that URL to a UIImage. It works successfully as i've added breakpoints all the way. I even tried with a image in my library to see if that would change the outcome but it didnt.
public class Switch_iOS : SwitchRenderer
{
Version version = new Version(ObjCRuntime.Constants.Version);
protected override void OnElementChanged(ElementChangedEventArgs<Switch> e)
{
base.OnElementChanged(e);
if (e.OldElement != null || e.NewElement == null)
return;
var view = (CustomSwitch)Element;
if (!string.IsNullOrEmpty(view.SwitchThumbImage))
{
if (version > new Version(6, 0))
{
Control.OnImage = FromUrl(view.SwitchThumbImage);
Control.OffImage = FromUrl(view.SwitchThumbImage);
}
else
{
Control.ThumbTintColor = view.SwitchThumbColor.ToUIColor();
}
}
}
public UIImage FromUrl(string uri)
{
using (var url = new NSUrl(uri))
using (var data = NSData.FromUrl(url))
return UIImage.LoadFromData(data);
}
}
Is "Control.OnImage" and "Control.OffImage" not working with the latest Xamarin Forms? I also intend to make a background image to the switch.
Unfortunately , about OnImage and OffImage of UISwitch , from iOS 7 has no effect.
Have a look at the apple document :
In iOS 7 and later, this property has no effect.
In iOS 6, this image represents the interior contents of the switch.
The image you specify is composited with the switch’s rounded bezel
and thumb to create the final appearance.
Instead you can use
onTintColor to set the tint color of the switch when it is turned on.
tintColor to set the tint color of the switch when it is turned off.
thumbTintColor to set the tint color of the thumb.

Xamarin Forms Redraw StackLayout on Device Orientation Change

In my MainPage.xaml, which is a ContentPage, I have a GradientColorStack.
<local:GradientColorStack x:Name="ColorStack" StartColor="#FF0000" EndColor="#FFFF00">
This class has StackLayout as a base class and it presents a background that has a gradient color fill. I got this idea from here.
public class GradientColorStack : StackLayout
The problem is that on device orientation change, the background color fill is not re-drawn. Thus in landscape orientation there is a big gap filled with black where you can see through the GradientColorStack to the ContentPage background.
Is there a way to force the GradientColorStack to re-draw on device orientation change?
iOS Version
I added the following method to my renderer class:
protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
{
SetNeedsDisplay();
base.OnElementPropertyChanged(sender, e);
}
This causes the Draw() method of the same class to be called on a screen orientation event. In Draw() I now find the existing CAGradientLayer (if it exists) and remove it from the super layer and then just let the Draw() routine then calculate a new CAGradientLayer as usual, which it then adds to the NativeView.Layer.Sublayers collection as usual.
Thanks to #SHUBHAM SHARMA for the tip of using SetNeedsDisplay() but this post was also required to get the solution working.
Android Version
It turns out the Android version was already working to correctly redraw the gradient layer (see tutorial). I think this is because of the following method in my renderer class:
protected override void OnElementChanged(ElementChangedEventArgs<StackLayout> e)
{
base.OnElementChanged(e);
if (e.OldElement != null || Element == null)
{
return;
}
var stack = e.NewElement as GradientColorStack;
this.StartColor = stack.StartColor;
this.EndColor = stack.EndColor;
}
You can use ForceLayout() in android Renderer and SetNeedDisplay() in iOS Renderer because these function are forcefully refresh the layout.

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.

Change EditText Cursor Color in Xamarin Forms

I have an Entry in my ContentPage and am doing rendering in Xamarin Android.
Here my problem is EditText background color is white and cursor color is also white.
Here I want to change the cursor color to black.
Is there any way to change the cursor color?
Here is my code.
Entry to ExtendedEntry :
public class ExtendedEntry : Entry { }
Use ExtendedEntry in Content Page :
var txtPhoneNumber = new ExtendedEntry { Placeholder = "Phone Number", Keyboard = Keyboard.Numeric, TextColor = Color.Black };
Render the ExtendedEntry in Xamarin Android :
using Xamarin.Forms.Platform.Android;
using Xamarin.Forms;
[assembly: ExportRenderer(typeof(ExtendedEntry), typeof(ExtendedEntryRender))]
namespace Project.Droid
{
public class ExtendedEntryRender : EntryRenderer
{
// Override the OnElementChanged method so we can tweak this renderer post-initial setup
protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
{
base.OnElementChanged(e);
if (e.OldElement == null)
{ // perform initial setup
// lets get a reference to the native control
var nativeEditText = (global::Android.Widget.EditText)Control;
// do whatever you want to the textField here!
nativeEditText.SetBackgroundResource(Resource.Drawable.text_box);
}
}
}
}
Can any one help me to solve this problem?
Thanks in advance.
You can change the cursor color using:
IntPtr IntPtrtextViewClass = JNIEnv.FindClass(typeof(TextView));
IntPtr mCursorDrawableResProperty = JNIEnv.GetFieldID (IntPtrtextViewClass, "mCursorDrawableRes", "I");
JNIEnv.SetField (Control.Handle, mCursorDrawableResProperty, 0); // replace 0 with a Resource.Drawable.my_cursor
0 will keep the same color as the TextColor on your Entry.
Edit: To change the cursur color the only option is to change the theme by adding for example:
Theme = "android:style/Theme.Holo.light" in MainActivity

Resources