-
Sencha User
Ext.Picker: why not make it so slots work horizontally too?
I'm building an app containing a few horizontal sliders. I figured Ext.Carousel would be the right behavior but it is a dataview to interact with cards, not a value selector. So Ext.Picker is much better targeted to do this, given that I want is to retrieve always the selected value... I figured I could modify Ext.Picker.Slot behaviors a little:
http://screencast.com/t/CjpTav3tucei
This is not bullet-proof yet, and I was strongly wondering if you (the Sencha devs) where thinking of implementing an horizontal version of Picker/Slot.
The main problem I found is that being in a container – hbox – it expands 100%, so the "containerSize" does not increase further than this (the browser's window width).
Ext.Picker.Slot should measure the total width of its container (using the dataview's items) and achieve in this way a good snapping effect and more solid behavior.
This is a feature request. Whether or not you decide to make Ext.Picker work horizontally too, I'm going to extend it so it works properly for me. If anybody would be interested in this let me know, and I'll post my code to Github when finished.
Keep up the good work!
-
Sencha User
We have no plans for this at this time. Good idea, though. Looking forward to your implementation.
-
Ext JS Premium Member
This is a really great idea, I would love to see your example of this in Github to see how you would solve the problem...
-
-
Ext JS Premium Member
I'm super excited to see how you did this!!
-
Sencha User
-
Sencha User
Thanks a lot! This will save me days of work.
-
Sencha User
Thanks!
-
Sencha User
Hi,
Thanks for the contribution!
I tried to add the plugin but it says
Uncaught TypeError: Object [object Object] has no method 'setSnap'
in
PickerSlot.js:70
I tried to check where that came from, and I saw this line:
scroller.setSnap(barWidth);
In the documentation it says no such function exists, so I changed it to:
scroller.setSlotSnapSize(barWidth);
That made it work.
But 2 more issues:
1. slotpick: function(value) {
// This is for your senses...
console.log(value);
},
Wasn't called after the slot was picked.
2. I couldn't create a separate view and use it as an xtype.
I added all the files and created a view:
Ext.define("Fabula.view.PlaceBetPicker", {
extend: 'Fabula.ux.Picker',
xtype: 'StakePicker',
But it didn't work. The result was a standard picker, like the original one. Any clue?
Thanks in advance for the assistance!
And I hope my small fix will help someone
Posting Permissions
- You may not post new threads
- You may not post replies
- You may not post attachments
- You may not edit your posts
-
Forum Rules