Trying to RTLify (Convert to Right-to-Left) a sencha touch NestedList.
How do I change the default Animation direction when clicking an item?
How do I place the back button on the top-right side instead of top-left?
Figured it out.
nestedlist.getLayout().setAnimation({type:'slide',direction:'right'});
add this in your nestedlist config backButton:{ui:'forward', align:'right'}
Related
I have a Toolbar with buttons that have images just above their text. I want users to click the button and then drag. That should drag the image as long as the mouse button is held down. This should also work for touch screens (fingers).
I've been trying to use the code from this answer Mouse click and drag Event WPF. But it doesn't seem to do anything. I end up dragging the entire form.
Any suggestions on how I can start this or if it is even possible?
I am using angular-material in my project.
I have requirement in which I have to show left and right arrow automatically that will indicate there is scroll horizantally.
as you can see in the picture.
You can use for it one of the angular carousel modules. Like this.
Or one of the list
There is a sample slide menu with items in it. When we minimize menu, there are tooltips if we hover the items. How to remove these tooltips?
You can override onToolStripMouseOver with an empty function.
Working example: http://codepen.io/anon/pen/vGdgpG
(You'll might want to override onToolStripClick too so the floating element will not appear when clicking)
Instead of clicking on a button and showing the slide navigation menu, how to show the menu by just sliding the screen. Say for example the menu button is positioned on the top left corner. When I swipe the screen from left to right the menu must open likewise it should close if I swipe from right to left.
You could add a swipe listeners to the Viewport and call the events accordingly
Ext.Viewport.bodyElement.on('swipe', function (event, node, options){
var button = Ext.ComponentQuery.query('button');
if (event.direction == 'right') {
button[0]._handler();
} else {
button[1].fireAction('tap');
}
});
Fiddle: https://fiddle.sencha.com/#fiddle/c1p
Obviously this fiddle has bugs and should only be used so you can have an idea of how to implement your solution.
See here solution for how to show the side menu by just sliding the screen in Sencha Touch 2.4.1
Sencha Touch - menu and edge swipes errors
I am using sencha to update a panel as follows.
I will have a handler for a button.
In that i am removing a docked panel from a panel. and then adding the some new panel as a docked item.
But the contents of the panel are not appearing. They are appearing only when i change the size of the browser window, i.e., maximize it or restore it.
How can the problem be solved?
The code for the problem is as shown below.
handler: function(){
chaptersPanel.removeDocked(chaptersList[chaptersPanel.getStory()]);
chaptersPanel.insertDocked(0,chaptersList[this.no]);
chaptersPanel.setStory(this.no);
chaptersPanel.doLayout();
mainPanel.setActiveItem("chaptersPanel");
}
YOu need to do a doComponentLayout() sometimes. Sencha Touch is a little flakey about it. doLayout is supposed to handle the componentlayout, but it doesn't always