Hello NativeScript.
I wanted to make a slider with square thumb button. I realized that's impossible to do on NativeScript yet because it ships with only circle thumb slider:
https://docs.nativescript.org/angular/code-samples/ui/slider
I'm very surprised because normally sliders ship with customizable thumb button.
Take a look at React Native slider components for example:
https://www.npmjs.com/package/react-native-slider
Please include more slider UI components and let us customize them easily on CSS.
I feel NativeScript really lacks UI components, styling methods. It's missing lots of CSS3 properties and there's no Canvas API implemented yet, no support for creating SVG... etc
I want to use NativeScript but I don't want to make too basic UI which will look the same with others.
Please implement more UI options to NativeScript. In my opinion, that's the only factor which makes NativeScript behind React Native.
Thanks,
Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.
Hi @jamesharvey2,
Thank you for the feature request and for your interest in NativeScript.
We will research how we could extend the Slider styling functionality and what are the possible ways to include support for different thumbs.
Also, any pull request which provides similar support will be highly appreciated. For more info, you could review our contribution guidelines.
Regarding the CSS properties, you could review the currently supported ones and you could log new feature request if a specific property, which you needed is missing.
About the SVG support, you could review nativescript-svg, which is created by one of our community members and if you need further help with it, you could contact the plugin's author via logging a new issue in nativescript-svg repo.
I would also suggest reviewing nativescript-pro-ui plugin and its documentation. The plugin provides extended component similar to SideDrawer, Charts, AutocompleteTextView, etc., that might help you while building your app.
Let me know if I could assist you further.
Hello Tsonevn,
That would be so nice. Yes, please implement customizable slider on NativeScript.
I would recommend you guys to take a look at HTML's slider component which is fully customizable.
https://css-tricks.com/styling-cross-browser-compatible-range-inputs-css/
It ships with properties like:
input[type=range]::-ms-track,
input[type=range]::-webkit-slider-thumb,
input[type=range]:focus,
input[type=range].
You can customize it in any way you want. This is the way it has to be...
Missing CSS3 properties should be implemented along with SVG capability & Canvas API.
Thanks,
Most helpful comment
Hi @jamesharvey2,
Thank you for the feature request and for your interest in NativeScript.
We will research how we could extend the Slider styling functionality and what are the possible ways to include support for different thumbs.
Also, any pull request which provides similar support will be highly appreciated. For more info, you could review our contribution guidelines.
Regarding the CSS properties, you could review the currently supported ones and you could log new feature request if a specific property, which you needed is missing.
About the SVG support, you could review nativescript-svg, which is created by one of our community members and if you need further help with it, you could contact the plugin's author via logging a new issue in nativescript-svg repo.
I would also suggest reviewing nativescript-pro-ui plugin and its documentation. The plugin provides extended component similar to SideDrawer, Charts, AutocompleteTextView, etc., that might help you while building your app.
Let me know if I could assist you further.