Set cursor position of the editor control exactly where user tapped in Xamarin.forms - ios

I am working in Xamarin.forms project. I want to set the cursor position of the Editor control exactly where the user tapped. I want to achieve this specifically in IOS (better to have a solution in Android too). I have gone through a couple of articles where they suggested using a custom renderer but I don't know how. I have gone through the following articles
https://social.msdn.microsoft.com/Forums/en-US/5bf7c17c-51c2-4e9e-bc09-73e9a5512fc3/how-to-change-the-cursor-position-of-entry-or-editor-programmatically?forum=xamarinforms
Set CursorPosition in Editor Xamarin Forms
Based on the above link, I have made a custom renderer of the Editor control. The code inside OnElementPropertyChanged in custom render keeps my cursor on the starting position of the editor control but I don't want this. The cursor position should change where the user tapped. we need to update the code inside the renderer according to my use-case.
public class CustomEditor : Editor
{
}
public class CustomEditorRenderer : EditorRenderer
{
public CustomEditorRenderer() { }
protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);
if (Control != null)
{
// just change this statement to the one that works.
Control.SelectedTextRange = Control.GetTextRange(fromPosition: Control.BeginningOfDocument, toPosition: Control.BeginningOfDocument);
}
}
}
I have to use Editor control, not Entry control because I want to enter text in multiple lines. Editor control doesn't have a CursorPosition property like Entry control.
Can anyone suggest a better way through a custom renderer or via utilizing TextChanged, Focused event?

You can change your Renderer code to change the cursor position:
//Change the cursor position to the fifth character
var test = Control.GetPosition(Control.BeginningOfDocument, 5);
Control.SelectedTextRange = Control.GetTextRange(test, test);
If you want to change the cursor to the user's clicked position, you need to get the user's clicked position and convert it to the corresponding index value. For getting the user's click position, you can refer to the documentation:Walkthrough: Using Touch in Xamarin.iOS

Related

Using DockPanelSuite, how do you get context menu for tab strip separate from document tab?

When using DockPanelSuite, is it possible to have a context menu for the tab strip that is different from the one for a document tab? For example, right click an empty space on the tab strip and get one context menu then right click a document tab and get a different context menu specific to the document.
I tried setting the ContextMenuStrip property of the DockPanel. I got a context menu for any empty space on the DockPanel control as well as the document tab strip when visible and all open document tabs. That's a good start but I really only wanted the context menu for the tab strip. Not the main control or any tabs.
I also followed along with the sample project to make a context menu for the document by setting the TabPageContextMenuStrip property of the DockContent form. I discovered that you get a document specific context menu by right clicking the document tab, but it also overrides the DockPanel's ContextMenuStrip. While that is useful, it's still not the desired result.
Edit:
Updating this post in case anyone else is interested in achieving the objective of the question.
After much source code analysis and testing, I concluded that the objective could not be achieved using the available public Properties, Methods, and Events. However, we can achieve the goal by using a bit of reflection.
Discoveries:
DockContent.ContextMenuStrip
This property does nothing for the DockPanel. It will provide a context menu in the client area of the document. However, for some reason, the RichTextBox control set to Fill in the provided sample blocks the context menu from popping up.
DockContent.TabPageContextMenuStrip
This property causes the associated ContextMenuStrip to display when the document is active. However, it displays when you right click anywhere on the tab strip, not just when you right click the document tab.
Solution:
First, add a public property to the DockContent form which will contain a reference to the context menu.
public ContextMenuStrip TabContextMenu { get { return contextMenuTabPage; } }
Next, add an event handler in the MDI main form for the DockPanel.ActiveDocmentChanged event. This will be used to add an event handler to the tab strip after it’s been created.
this.dockPanel.ActiveDocumentChanged += new System.EventHandler(this.dockPanel_ActiveDocumentChanged);
private void dockPanel_ActiveDocumentChanged(object sender, EventArgs e)
{
// Hook into the document pane tabstrip mouse up event
// if we haven't already.
if (dockPanel.ActiveDocumentPane != null
&& dockPanel.ActiveDocumentPane.TabStripControl != null
&& dockPanel.ActiveDocumentPane.TabStripControl.Tag == null)
{
dockPanel.ActiveDocumentPane.TabStripControl.Tag = "MouseUp Hooked";
dockPanel.ActiveDocumentPane.TabStripControl.MouseUp +=
TabStripControl_MouseUp;
}
}
Finally, add the event handler for the TabStripControl.
private void TabStripControl_MouseUp(object sender, MouseEventArgs e)
{
// Capture right click action
if (e.Button == MouseButtons.Right)
{
ContextMenuStrip menu = contextMenuDocumentPane;
Point screenPos = Cursor.Position;
Point tabstripsPos = dockPanel.ActiveDocumentPane
.TabStripControl.PointToClient(screenPos);
// Determine if cursor is over a tab
var tabstrip = dockPanel.ActiveDocumentPane.TabStripControl;
var tabs = tabstrip.GetType()
.GetProperty("Tabs", BindingFlags.Instance |
BindingFlags.NonPublic).GetValue(tabstrip);
foreach (var tab in (IEnumerable)tabs)
{
var bounds = tab.GetType()
.GetProperty("Rectangle")
.GetValue(tab);
if (((Rectangle)bounds).Contains(tabstripsPos))
{
// Display context menu for this document tab
var document = tab.GetType()
.GetProperty("Content")
.GetValue(tab);
menu = ((ContentWindow)document).TabContextMenu;
}
}
// Show appropriate context menu
menu.Show(screenPos);
}
}

How do I prevent one specific character to be entered into a UITextView (in Xamarin)?

I need to prevent users from entering a caret ("^") into a notes field that is implemented in a UITextView. I found this question: prevent lower case in UITextView, but it's not clear to me when/how often the shouldChangeTextInRange method will be called. Is it called for each keystroke? Is it named this way because it will be called once for a paste? Instead of preventing the entire paste operation, I'd rather strip out the offending carets, which it doesn't look like that method can do.
Our main application (written in C++Builder with VCL components) can filter keystrokes, so that if ^ is pressed, it beeps and the character is not added to the text field. I would like to replicate that behavior here.
Is there any way to do that sanely in Xamarin? I'm doing iOS first, and might be asking about Android later.
Thanks for your help!
Are you using Xamarin.Forms to build your UI? If you're going to be targeting Android, I highly recommend doing so.
If that is the case, then you can easily do this with a custom Entry subclass:
public class FilteredEntry : Entry
{
private string FilterRegex { get; set; }
public FilteredEntry (string filterRegex)
{
// if we received some regex, apply it
if (!String.IsNullOrEmpty (filterRegex)) {
base.TextChanged += EntryTextChanged;
FilterRegex = filterRegex;
}
}
void EntryTextChanged (object sender, TextChangedEventArgs e)
{
string newText = e.NewTextValue;
(sender as Entry).Text = Regex.Replace (newText, FilterRegex, String.Empty);
}
}
Usage:
// The root page of your application
MainPage = new ContentPage {
Content = new StackLayout {
VerticalOptions = LayoutOptions.Center,
Children = {
new FilteredEntry(#"\^")
}
}
};
A typed ^ will be stripped out of the Entry's Text.

How can i resize a tooltip on moseover() using ActionScript and add more interactive content in it?

I like to make a general module in ActionScript to create an interactive tooltip. The tooltip has to resize on mouseover() event and then should contain hyperlinks once resized. Thanks
Yes, its possible. Are you using Flex? or just pure Actionscript? In the case of actionscript:
Add an event listener to rollOver event, and display the tooltip, heres some code:
[in some function, after the comp is added to the stage ]
public function myComp(){
myComponent.addEventListener(MouseEvent.ROLL_OVER,createToolTip);
stage.addEventListener(MouseEvent.CLICK,destroyToolTip);
}
private var toolTip:CustomToolTip;
private function createToolTip(e:MouseEvent):void{
toolTip = new CustomToolTip();
stage.addChild(myToolTip);
myToolTip.x = e.localX;
myToolTip.y = e.localY;
}
private function destroyToolTip(e:Event):void{
stage.removeChild(toolTip);
toolTip = null;
}
(you might need to refine the tooltip destruction logic, now it gets destroyed, if you click anywhere. For example you could call Event.stopPropagation, if the user click inside the tooltip. )
The custom tooltip class:
package{
class CustomToolTip extends Sprite{
public function CustomToolTip():void{
super();
// put drawing logic, children, text,... here.
}
}
}

Close Blackberry Map after use of custom menu item

I created for BlackberryMaps a own menu item with help of "MenuItem" and invoke Blackberry Maps. After using this Item the current location (MapView) should be send back to my Application. This works fine.
The problem is I found no solution for closing the app after using the menu Item. Is there a possibility to close Blackberry Maps? Or set my own App to foreground?
private static class MapMenuItem extends ApplicationMenuItem {
//creates a new MenuItem for Blackberry Maps and defines the action which should //happen after a click on the MenuItem
CustomDialog_GPS customDialogGps;
StartScreen startScreen;
MapMenuItem(StartScreen startScreen, CustomDialog_GPS customDialogGps) {
super(20);
this.startScreen = startScreen;
this.customDialogGps = customDialogGps;
}
public String toString() {
//creates the name for the navigation Menu
String itemName = ""+_res.getString(CUSTOMDIALOG_GPS_USE_AS_NEW_LOCATION);
return itemName;
}
public Object run(Object context) {
//defines what should happen after a click on the menu
//get the location at which the cursor is pointing at.
MapView mv = (MapView)context;
if (mv != null) {
//opens a method inside of CustomDialogGPS which handles the latitude and longitude
customDialogGps.saveAdjustedPosition(mv);
//TODO pop Screen
//Screen screen = (Screen)UiApplication.getUiApplication().getActiveScreen();
}
else {
throw new IllegalStateException("Context is null, expected a MapView instance");
}
return null;
}
}
Unfortunately you can't close another app programmatically (Actually you can if you know where is menu item to close for example) but you can foreground your app UiApplication.getApplication().requestForeground(). What is probably appropriate solution for you.
Instead of passing the user to the Maps application, which is outside your app and you have no control over it, create your own screen with a MapField in it. Using your own screen and perhaps extending the MapField class to override functions if needed, allows you to go back to the previous screen once the user selects a location.

Vaadin addStyleName problem

I created a TextField with TextChangeListener. When user types in certain values (in this case 'admin') then addStyleName is invoked on that field and font color becomes red. But afterwards, the value is blank and each entered character is being cleared.
Here is the code of the application. Why after adding new style to TextField its value changes?
public class VaadintestApplication extends Application {
#Override
public void init() {
Window mainWindow = new Window("Vaadintest Application");
setTheme("test");
TextField textField = new TextField("username");
textField.setEnabled(true);
textField.setTextChangeEventMode(TextChangeEventMode.EAGER);
textField.addListener(new TextChangeListener() {
public void textChange(TextChangeEvent event) {
if ("admin".equals(event.getText())) {
((TextField) event.getComponent()).addStyleName("text-error");
} else {
((TextField) event.getComponent()).removeStyleName("text-error");
}
}
});
mainWindow.addComponent(textField);
setMainWindow(mainWindow);
}
}
I would guess that the following happens:
The style name change triggers a repaint on the server, causing the TextField component to be serialized again to the client
The client receives the serialization (the whole bloody thing, not just the changed parts, because that's how things work with Vaadin), and hence it changes the contents of the textfield, while ignoring any changes that are pending from the text change listener
Solutions:
Update the value of the TextField at the same time you add/remove the style name: ((TextField) event.getComponent()).setValue(event.getText())
Create a custom client side widget which extends VTextField and add the functionality there

Resources