Get a list-item to highlight when tapped

[dash]

How can I get a list-item to highlight when tapped.

I'd like to change the background color to give some feedback of a tap  and back to normal when released.

This is not selecting an item.

 

[Henrique]

I'm doing the same thing by changing the css and then calling refresh (listView.refresh())

[Deyan]

Hello,

There is an example of similar scenario in our NativeScript Marketplace demo here:

https://github.com/NativeScript/nativescript-marketplace-demo/tree/release/app/examples/listview/selection

@Henrique, normally, you should not be calling refresh() to highlight the selected item. Please take a look at the thread you've opened on the forums regarding this case.

Thanks!

Regards,
Deyan
Telerik by Progress

[Marc]

Hello,

 

I'd really like to see, that any touchable view (Layout Container, Button, ListView item,...) is able to inherit the native touch effect (ripple) on Android and iOS.

Right now I am switching a lot between the usual ListView and the RadListView component. On the one hand, I want to use the RadListView because of its extra features like pull to refresh, multiselection etc.... on the other hand I do not want to loose the native ripple effect (on Lollipop and the native touch effect on previous Android versions, also on iOS) when tapping on a list item. Thats why i'm considering to go back to the default ListView component.

I think changing the backgroundColor of the tapped list item does not feel native anymore and that would go against the idea why I want to use the NativeScript framework.

[dash]

Deyan - where in the demo is the tapped effect taking place.

I assume it's in selection-view-model.ts.

I looked at the code and it's more selection specific. On a single tap/release - i'd like the item to change color and back to normal.

 

 

I'm using RadListView with no extra features - but in the item definition I'm turning sections on/off depending on context. How interchangable are RadListView and ListView.

 

 

[Deyan]

Hi,

@Marc, RadListView uses the native RecyclerView component from the Android SDK which does not have the Ripple effect by default. You can easily enable it using the following NativeScript plugin: https://www.npmjs.com/package/nativescript-ripple

@dash if you want to highlight an item only when interacting with it, that would require different events compared to those that drive the selection behavior. We will log this in our TODO list and will provide a way to implement it.

Regards,
Deyan
Telerik by Progress