I have the following code:
<TextField id="txtPhone" top="20" left="15" right="40" returnKeyType="Ti.UI.RETURNKEY_GO" keyboardType="Ti.UI.KEYBOARD_TYPE_PHONE_PAD">
<KeyboardToolbar platform="ios">
<Toolbar>
<Items>
<Button systemButton="Titanium.UI.iOS.SystemButton.FLEXIBLE_SPACE"/>
<Button title="Save" systemButton="Titanium.UI.iOS.SystemButton.SAVE"/>
</Items>
</Toolbar>
</KeyboardToolbar>
</TextField>
The orgional issue I had was that ios does not have a "Done" button for keyboardType="Ti.UI.KEYBOARD_TYPE_PHONE_PAD". Therefore the solution I found from other StackOverflow answers was similar to the above.
The issue is that the keyboard toolbar does not appear in sync with the keyboard.
I found a video that demonstrates this issue. https://www.youtube.com/watch?v=Cd95W1LvNXk&feature=youtu.be . However, it is quite fast on the video, so I suggest watching it at 0.25 speed.
As you can see, when closing the keyboard, the numberpad reaches the bottom of the screen faster than the keyboard toolbar.
Similarly, when opening the keyboard, the keyboard toolbar appears faster than the number pad.
How can I fix this issue?
This is the normal behaviour of opening/closing keyboard toolbar in Titanium.
I think the toolbar animates in same duration as the keyboard takes, but the difference is of curve behaviour which is Ti.UI.ANIMATION_CURVE_EASE_OUT
Using the above fact, if you really need the same timing as of keyboard, then you can create a manual view and animate it using the same curve Ti.UI.ANIMATION_CURVE_EASE_OUT.
This is the only solution for now, but remember that doing so can cause you to do extra calculations on scrollview's scroll positions because when you will animate a manual view, then it can cover up your text-fields which are moved up by iOS itself by same amount as of keyboard height, and in some cases it might not be possible to scroll up the last textfield.
So, you will need to scroll the scrollview to adjust the textfield position (it's a lot lot more task to do, better don't mind that delay issue and stay happy :) )
Related
How can I automatically scroll the view up when I focus in a TextInput box and a keyboard is shown such that the TextInput box is not hidden behind the keyboard?
This question has been asked on StackOverflow a few times and I implemented the solution here which is the general solution advised in most of the answers. This solution works fine in the iPhone simulator but doesn't work on the actual phone. Has anyone else experienced this problem that the solution doesn't work on the actual phone?
Second thing that I noticed after adding this solution is that now if I am focussing in a TextInput box and keyboard is shown, if I press a button or try to focus into a different TextInput box, the first touch is always consumed to hide the keyboard and the button is not pressed or the other TextInput box is not focussed. It is a little annoying for the user to have to do the operation twice. Has anyone else observed this problem?
Please let me know if you have any inputs on how to solve these problems?
I assume you are using this solution. I ran into the same problem and made some adjustments (see gist). I addressed both problems you describe. keyboardShouldPersistTaps solves your second problem.
I have not found the exact reason why the spacing works in Simulator but not on a real device. It has something to do with the timing. The original code sets a timeout on input focus and tries to scroll down after 50ms. Increasing this to for example 500ms makes it work on devices too, but I don't really like adding magic timeouts that I don't understand. I changed it, so onFocus I look up the element to scroll to and store a reference. When onKeyboardDidShow fires I use the reference.
I'm having a problem scrolling in all the JetBrains IDEs (PyCharm, PhpStorm) using touch screen. I have a Dell XPS 15 with a touchscreen.
When I try to scroll it just selects code. I have tried in regular Notepad and Notepad++ and there works as expected.
Has anyone else experienced it? Is there any solution to this? It would be really great to scroll through the code using touchscreen.
I have found temporary solution by installing plugin Code glance (https://plugins.jetbrains.com/plugin/7275). The plugin provides a sidebar with code map, which is similar to the one from Sublime. In the sidebar it is possible to navigate through code. It is not ideal but it's better than nothing.
Yes, I was having the same problem. And luckily I got a gesture to scroll using two fingers:
Scroll up: Tap and hold using one finger and swipe away[from close to distant of the first finger] using another finger. Swiping away from each other also works.
Scroll Down: Tap and hold using one finger and swipe in[from distant to close of the first finger] using another finger. Swiping close to each other also works.
On Android 4, when press-holding a key with accented characters like "i", a popup menu for the accented characters is displayed. Then sliding the finger into the button of any accented character within the popup menu highlights/selects the button, and finally releasing the finger, inputs the accented character into the target textbox.
I'd like to reproduce this (with a vertical popup menu) in QML with the addition of a scrolling behaviour when finger reaches the top or bottom of the popup menu (typical application: select a temperature among a hundred of values)
I tried to use a ListView for the popup menu, but the default scrolling behavior is not the one I need.
So far I managed to make a lame hack, using a Timer to update the ListView's contentY, but the code as well as the result look wrong. I was wondering if there is a proper way to achieve that.
Thanks
Sorry for posting as an answer but dont have the 50 for commenting.
What do you mean with default scrolling behavior? Maybe the PathView is your answer, if I understood properly.
Further details will be appreciated
I have a UIView within a UIScrollView. When i want to simulate the drag event on the UIView, swipe event on the UIScrollView is being triggered.
As per the documentation , there isn't much of a difference between swipe and drag.
Swipe
1- Place the pointer at the start position.
2- Hold the mouse button.
3- Move the pointer in the swipe direction and release the mouse button.
Drag
1- Place the pointer at the start position.
2- Hold down the mouse button.
3- Move the pointer in the drag direction.
On an ipad I can use two fingers two swipe and one finger to drag. Now, how do i go about doing something similar on the simulator; drag instead of a swipe?
Edit 1:
I should have been clearer first up. Anyway, my problem is that the mouse drag is firing the swipe instead of drag, thereby scrolling the scroll view instead of passing on the drag event to the UIView contained by the scroll view.
I am on macbook pro. Two-finger swipe on the touchpad is being ignored. Touch and drag is causing the same thing as mouse-drag.
Thanks
See Jeff LaMarche's quick note on how to do this. It's documented in the same page you're reading, but Jeff's explanation is clearer.
If you want to simulate a two-finger gesture in the iPhone simulator, hold down the option key. You will get two dots on the screen instead of one. The two dots will default to pinching - if you bring the dot closer to the center of the screen, the other dot comes toward the center, making it easy to simulate a pinch in or pinch out.
If you want to do a different two-finger gesture, get the two dots the distance apart that you want them to be, then hold down the shift key, while still holding down the option key. That will lock the position of the two finger presses together so you can do, for example, a two-finger swipe.
see this documentation below:
iOS Simulator User Guide
Just use the mouse to drag the view, aka, left click the view then move the mouse
I ended up disabling the scrolling from the UI and added two buttons to scroll the scroll view. Since this is a work around only for the emulator, I have used #ifndef to hide the buttons while building for the device.
I have an app that has a list of tags on the bottom of the window. This list grows over time and needs to be scrolled horizontally. This was fine before, but now in Lion they scrollbars automatically hide. If using a mouse without a horizontal scroll, there's basically no way to scroll these now in Lion. What are the best practices here to solve the issue? Do I need to get rid of the scrollview and change it to a "More" list or something?
If the user doesn't have a device available which supports touch-based scrolling (e.g, a touchpad, Magic Trackpad, or Magic Mouse), the horizontal scrollbar won't be hidden by default. It's controlled by this preference option: