Xamarin letter spacing in password entry - xamarin

I have written custom renderer in ios for entry type to add letter space. It works when entry is not set for password type. How can I achieve this behavior for password entry?
protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);
var element = Element as PassowrdEntry;
if (element == null)
return;
if (!string.IsNullOrEmpty(Element.Text))
{
Control.AttributedText = new NSAttributedString(Element.Text, new UIStringAttributes
{
Font = Control.Font,
KerningAdjustment = 8
});
}
}

For me it's working I just increased the KerningAdjustment value to 10.
protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);
var element = Element as CustomEntry;
if (element == null)
return;
if (!string.IsNullOrEmpty(Element.Text))
{
Control.AttributedText = new NSAttributedString(Element.Text, new UIStringAttributes
{
Font = Control.Font,
KerningAdjustment = 10
});
}
}
Xaml:
<ctrl:CustomEntry Placeholder="Enter Pass"
IsPassword="True"/>

Related

How to Customise AutoCompleteTextView in Xamarin Forms

I am trying to Customise the look of AutoCompleteTextView i need a rounded Entry
till now i have tried this
[assembly: ExportRenderer(typeof(AutoCompleteViewv3),
typeof(AutoCompleteViewRendererv3))]
namespace PredictiveList.Droid
{
public class AutoCompleteViewRendererv3 : ViewRenderer<AutoCompleteViewv3,
AutoCompleteTextView>
{
static string[] COUNTRIES = new string[] {
"Afghanistan", "Albania", "Algeria", "American Samoa", "Andorra",
"Angola", "Anguilla", "Antarctica", "Antigua and Barbuda", };
public AutoCompleteViewRendererv3(Android.Content.Context context) : base(context)
{
}
protected override void OnElementChanged(ElementChangedEventArgs<AutoCompleteViewv3> e)
{
base.OnElementChanged(e);
if (e.OldElement != null || this.Element == null)
return;
// var textInputLayout = (TextInputLayout)LayoutInflater.From(Context).Inflate(Resource.Layout.TextInputLayout, null);
var autoComplete = new AutoCompleteTextView(Context);
autoComplete.SetBackgroundResource(Resource.Drawable.rounded_cornersrev);
//var autoCompleteTextView = (AutoCompleteTextView)LayoutInflater.From(Context).Inflate(Resource.Layout.TextInputLayout, null);
//var txtSearch = (AutoCompleteTextView)FindViewById(Resource.Id.autocomplete_country);
// TextView name = (TextView)Android.Views.View.FindViewById(Resource.Id.txt_searchhh);
AutoCompleteTextView textView = new AutoCompleteTextView(Context);
textView = FindViewById<AutoCompleteTextView>(Resource.Id.autocomplete_country);
var adapter = new ArrayAdapter<String>(Context, Resource.Layout.list_item, COUNTRIES);
autoComplete.Adapter = adapter;
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.
}
}
}
i am trying to implement this in Xamarin Forms if someone have some other idea please do suggest
also please help me how can i remove understroke of entry
Have a try this way:
AutoCompleteTextView textView = new AutoCompleteTextView(textView =FindViewById<AutoCompleteTextView>(Resource.Id.autocomplete_country);
textView.Background = null; // Set background be null

CustomRenderer iOS for button TouchUpInside change background

I'm trying to write a CustomRenderer for iOS through which I want to change the BackgroundColor of the button when the user touches it. So far i got this:
public class BtnRendereriOS : ButtonRenderer
{
protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.BackgroundColor = UIColor.FromRGB(3, 169, 244);
Control.Layer.CornerRadius = 0;
}
Control.TouchUpInside += (sender, UIButton) => {
Control.BackgroundColor = UIColor.Brown;
};
}
}
Its not working however. I guess there needs to be some sort of eventhandler in order to make this possible.
The background colors needs to be initially set (if not the default color), then you need to set it back to that same color on TouchUpInside and TouchUpOutside. On TouchDown, set it to the color that you wish it to be while the button is being pressed.
Toggle background color:
if (Control != null)
{
void BackgroundNormalState(object sender)
{
(sender as UIButton).BackgroundColor = UIColor.Green;
}
BackgroundNormalState(Control);
Control.TouchUpInside += (object sender, EventArgs e) =>
{
BackgroundNormalState(sender);
};
Control.TouchUpOutside += (object sender, EventArgs e) =>
{
BackgroundNormalState(sender);
};
Control.TouchDown += (object sender, EventArgs e) =>
{
(sender as UIButton).BackgroundColor = UIColor.Red;
};
}
Update:
Can i change my textcolor through this methodgroup as well?
There are is a SetTitleColor where you can assign different colors to the different UIControlState values, Normal and Highlighted are the ones to start with:
Control.SetTitleColor(UIColor.Red, UIControlState.Normal);
Control.SetTitleColor(UIColor.Green, UIControlState.Highlighted);

How to change Picker Border color in xamarin forms

My borderless custom renderer for picker
public class BorderlessPickerRenderer : PickerRenderer
{
public static void Init() { }
protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
{
base.OnElementChanged(e);
if (e.OldElement == null)
{
Control.Background = null;
}
}
}
It will change the picker list text color as white. please see the screenshot
If you check the source code of PickerRenderer, you will find that the Dialog is totally generated in the code behind.
So here to set a Transparent(border-less) background, we can re-write the Click event of this control, for example:
public class BorderlessPickerRenderer : Xamarin.Forms.Platform.Android.PickerRenderer
{
private IElementController ElementController => Element as IElementController;
private AlertDialog _dialog;
protected override void OnElementChanged(ElementChangedEventArgs<Picker> e)
{
base.OnElementChanged(e);
if (e.NewElement == null || e.OldElement != null)
return;
Control.Click += Control_Click;
}
protected override void Dispose(bool disposing)
{
Control.Click -= Control_Click;
base.Dispose(disposing);
}
private void Control_Click(object sender, EventArgs e)
{
Picker model = Element;
var picker = new NumberPicker(Context);
if (model.Items != null && model.Items.Any())
{
picker.MaxValue = model.Items.Count - 1;
picker.MinValue = 0;
picker.SetDisplayedValues(model.Items.ToArray());
picker.WrapSelectorWheel = false;
picker.DescendantFocusability = DescendantFocusability.BlockDescendants;
picker.Value = model.SelectedIndex;
}
var layout = new LinearLayout(Context) { Orientation = Orientation.Vertical };
layout.AddView(picker);
ElementController.SetValueFromRenderer(VisualElement.IsFocusedPropertyKey, true);
var builder = new AlertDialog.Builder(Context);
builder.SetView(layout);
builder.SetTitle(model.Title ?? "");
builder.SetNegativeButton(global::Android.Resource.String.Cancel, (s, a) =>
{
ElementController.SetValueFromRenderer(VisualElement.IsFocusedPropertyKey, false);
// It is possible for the Content of the Page to be changed when Focus is changed.
// In this case, we'll lose our Control.
Control?.ClearFocus();
_dialog = null;
});
builder.SetPositiveButton(global::Android.Resource.String.Ok, (s, a) =>
{
ElementController.SetValueFromRenderer(Picker.SelectedIndexProperty, picker.Value);
// It is possible for the Content of the Page to be changed on SelectedIndexChanged.
// In this case, the Element & Control will no longer exist.
if (Element != null)
{
if (model.Items.Count > 0 && Element.SelectedIndex >= 0)
Control.Text = model.Items[Element.SelectedIndex];
ElementController.SetValueFromRenderer(VisualElement.IsFocusedPropertyKey, false);
// It is also possible for the Content of the Page to be changed when Focus is changed.
// In this case, we'll lose our Control.
Control?.ClearFocus();
}
_dialog = null;
});
_dialog = builder.Create();
_dialog.DismissEvent += (ssender, args) =>
{
ElementController?.SetValueFromRenderer(VisualElement.IsFocusedPropertyKey, false);
};
_dialog.Show();
_dialog.Window.SetBackgroundDrawable(new ColorDrawable(Android.Graphics.Color.Transparent));
}
}
Rendering image of this custom picker:
The font color and button's style can be modified as you need since you created this dialog by yourself. And the style of the dialog also depends on the style of your app.

When setting an element property, why would I need to change the fontStyle each time?

I have take over on development of an application and I am looking at an iOS label custom renderer. I have the code for that below.
What I would like to know is if anyone can see a reason why the SetTextFontStyle method is called for when the textColor and textProperty are changed.
Also is there a way that I can use this custom rendered for more than one font type? I want to be able to pass in a font type to the renderer if possible.
public class LabelBodyCustomRenderer : LabelRenderer
{
public LabelBodyCustomRenderer()
{
}
protected override void OnElementChanged(ElementChangedEventArgs<Label> e)
{
base.OnElementChanged(e);
if (Control != null)
Control.Font = UIFont.GetPreferredFontForTextStyle(UIFontTextStyle.Body);
}
protected override void OnElementPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);
if (e.PropertyName == Label.TextColorProperty.PropertyName)
SetFontTextStyle();
else if (e.PropertyName == Label.FontProperty.PropertyName)
SetFontTextStyle();
else if (e.PropertyName == Label.TextProperty.PropertyName || e.PropertyName == Label.FormattedTextProperty.PropertyName)
SetFontTextStyle();
}
void SetFontTextStyle()
{
Control.Font = UIFont.GetPreferredFontForTextStyle(UIFontTextStyle.Body);
}
}

How to format radgrid cell programmatically

I have to format (backcolor, forecolor, font style) a radgrid's cells depending on the value of the cell.
For example
If the value is negative set the fore color of that cell as red.
Can any one please tell me how this can be achieved?
protected void grdName_ItemDataBound(object sender, GridItemEventArgs e)
{
if (e.Item is GridDataItem)
{
GridDataItem item = (GridDataItem)e.Item;
if (Convert.ToInt32(((DataRowView)item.DataItem)["Column"]) < value)
{
TableCell cell = item["Column"];
cell.BackColor = Color.PeachPuff;
}
}
}
Add the line onItemDataBound="Data_OnitemDataBound" to your radGrid declaration in your aspx page.
Then add this to your code behind. The number in the Cells[] is the index of the column you want to modify or validate against.
protected void Data_OnItemDataBound(object sender, GridItemEventArgs e)
{
if (e.Item is GridDataItem)
{
GridDataItem item = (GridDataItem)e.Item;
if (Convert.ToDecimal(item.Cells[3].Text) < 0)
{
item.Cells[3].ForeColor = System.Drawing.Color.Red;
}
}
}
Below code can be used for all the cells in the RadGrid.
protected void RadGrid_ItemDataBound(object sender, GridItemEventArgs e)
{
foreach (GridDataItem dataItem in RadGridProduct.MasterTableView.Items)
{
int cellCount = dataItem.Cells.Count;
foreach (GridTableCell item in dataItem.Cells)
{
if (item.Text == null ||Convert.ToInt32(item.Text) < 0 )
item.BackColor = System.Drawing.Color.Brown;
}
}
}

Resources