I've a couple of textFields and textAreas in a screen. When any one of them is focused and then if the sidemenu is opened, I can write on top of side menu. The keyboard doesn't disappear when sidemenu is clicked. In other cases as well, when keyboard is opened and the components like Label etc are touched, it'd be nicer if the keyboard disappear automatically.
See the video here
Related
My React Swiper works as expected with the mouse clicks, but for accesibility, some slides has a button. So, when I press the tab key, it show the button, but the slides are cut like the image shows and the navigation buttons disappear, I need that everything continuos showing and when a slide has the button focused, the div (slide) parent to be completed showed too. Thanks.
I am using the createBottomTabNavigator() to create a bottom tab bar with screenOptions={tabBarHideOnKeyboard: true,}.
The behavior of bottomtabbar on keyboard use is showing up and hiding on keyboard use.
is there any solution for not showing the tabbar on the keyboard?
I have a similar issue explained in this ticket: https://github.com/react-navigation/react-navigation/issues/6700.
I can't use android:windowSoftInputMode="adjustPan" this will affect other features.
I tried using keyboard event listeners but their is always a delay in tabbar display on the keyboard.
I have a basic create-react-app with Material/MUI text field and button. When I tab from the textfield to the button, it creates an animation on the button where the middle part slightly grows and shrinks. I'm trying to figure out how to get rid of that animation and just show a simple button that has focus. Toggling the options in Chrome debugger hasn't helped me track down where this animation is being created (focus, hover, etc.). In fact, anytime I change any property in the CSS panel it turns the animation off and makes it harder to track down what is causing this.
Thanks.
I have a React App where the user can toggle between different views of the same data structure. When toggling from one view to another, the browser window sometimes automatically scrolls vertically. Instead I am expecting the window to not scroll when possible.
The CodeSandbox here reproduces the issue:
https://codesandbox.io/embed/magical-chebyshev-otlpu?fontsize=14&hidenavigation=1&theme=dark
If you scroll down, then click on "CLICK TO SWITCH VIEW BELOW", you will notice that there's an automatic scroll to the top happening.
I suspect this is an issue with MUI TextField. If I change the MUI TextField to a div, the issue does not show up, so I don't think this is due to React.
I encountered this specific issue with Material's md-dialog:
I click on any of the text boxes on the web page, which brings up
the mobile keyboard, this is on IPad 9.3.2.
after typing, I then either minimise the keyboard or leave it on
and click a button which shows a md-dialog as modal.
the modal shows up, which grays out and blocks the whole page.
but the dialog box appears outside of the screen, i.e. you cant see
it, you cant touch it, you cant close it.
now if I til the screen to change the orientation from horizontal to vertical or vise-versa, the screen resizes and the dialog is shown properly.
so as soon as i use the keyboard the immediate dialog show will be located incorrectly.
I am wondering if any one had this problem before, and if you know how to solve this issue?
Thanks a lot
I had a similar issue and resolved it by wrapping it in a timeout:
var confirm = $mdDialog.confirm()
.title('Test')
.content('This is test content')
.ariaLabel('Test')
.ok('Got it!')
.cancel('Cancel');
$timeout(
$mdDialog.show(confirm).then(function () {
// Do Something
})
, 0);