How can I disable longPress and TextSelectable


#1

Hey ppl, first time coming here, new to NativeScript :slight_smile:

I have a requirement for an app we’re building and it’s that input fields (TextField) need to disable the user’s ability to copy/paste text into them.

The first thing I tried to do was to access the nativeElement property of the TextField, I created a ref in the HTML like this:

<ActionBar title="My App" class="action-bar">
</ActionBar>

<StackLayout class="page">
    <TextField #myTextField></TextField>
</StackLayout>

Then in my Component I tried to access it like this:

@ViewChild('myTextField') textFieldRef: ElementRef;
  constructor() {}

  ngOnInit(): void {}

  ngAfterViewInit() {
    const reference: TextField = this.textFieldRef.nativeElement;
  }

Here I tried a few things, first I tried to use the _applyXmlAttribute() method, using with and without the android namespace:

reference._applyXmlAttribute('android:longClickable', false);
reference._applyXmlAttribute('android:setTextIsSelectable', false);

or

reference._applyXmlAttribute('longClickable', false);
reference._applyXmlAttribute('setTextIsSelectable', false);

Didn’t work and noticed the method is deprecated. Then I tried to use both the .off() and the .removeEventListener() passing the gesture’s name and nothing.

Then tried to use these two methods:

reference.android.longClickable(false);
reference.android.setTextIsSelectable(false);

But no luck there, anyone knows how I can achieve this? We’re building a banking application and the client requires that the user can’t copy/paste into inputs.

By the way thank you so much for reading this far :slight_smile:


#2

I forgot something, I also tried using the .on('longPress', function(){}) and I get inside the function, but don’t know how to cancel it.


#3

It seems like I had a breakthrough a few moments ago, this is ‘working’:

ngAfterViewInit() {
  const reference: TextField = this.textFieldRef.nativeElement;
  if (isAndroid) {
    reference.on('loaded', event => {
      if (reference.android) {
        reference.android.setLongClickable(false);
        reference.android.setTextIsSelectable(false);
      }
    });
  }
}

And I say ‘working’ because it’s preventing the longPress, but the little bubble in the bottom of the cursor stills appears and if I click it it gives the copy/paste options, anyone knows how to hide that one?


#4

Try setCustomSelectionActionModeCallback


#5

Hey @manojdcoder thank you for replying, could you elaborate a bit more on that?

Reading the docs I’m trying to call the function from the android reference and return false:

reference.android.setCustomSelectionActionModeCallback(() => {
  return false;
});

But when I do that, or when I do it like reference.android.setCustomSelectionActionModeCallback(false) I get an error saying

System.err: Error: Cannot convert object to Landroid/view/ActionMode$Callback; at index 0

Any tips are appreciated :slight_smile:


#6

It’s not a method call, you will have to set a interface implementation. Checkout the sample code in Android docs and cast it to TypeScript.