I want to close the keyboard when the user clicks a particular tab.
What's happening now is that when the keyboard is open and the user wants to switch to another tab, he must close/minimize the keyboard first.
The prop on a ScrollView keyboardShouldPersistTaps does what I want, but only for a ScrollView, not for a TabNavigator component.
You can use a function to hide the keyboard and call it from onClick of that tab.
This is the function you should declare in the same class in which onClick of that tab exists.
#SuppressWarnings("ConstantConditions")
public void hideKeyBoard(View view){
InputMethodManager imm = (InputMethodManager) getSystemService(INPUT_METHOD_SERVICE);
imm.hideSoftInputFromWindow(getCurrentFocus().getWindowToken(),0);
}
And then from the onClick, just call this by using hideKeyBoard();.
This will hide the keyboard whenever that tab is tapped.
And You should provide some of your code if seeking help.
Related
Problem:
Using "TextInput" in react native shows keyboard, and on pressing return, cursor moves to new line, however at this i do not have "done" button to hide the keyboard.
Again, there is props called "returnKeyType={done}, which adds "done" button but now "return" button is gone. I believe user could tap to new line inside "TextInput" box, but it seems to highlight the words typed.
Solution attempt:
Like in numeric keyboard, i thought there should be some props to add "done" button on top of keyboard so that we will have both "return" and "done" botton visible at the same time, but i could not find it.
... another option is i could create my own component with done button, and wrap keyboard as child, but i could not figure out how i do it.
This is basic component, i believe there must be some elegant way to do it. any help is appreciated.
You cannot have done and newline button at the same time.
There should only be one submitting button in keyboard.
But you can make a similar work around.
Custom Button
First option is making custom button like you mentioned.
Make a "Done" button next to your textfield or above the keyboard.
onSubmitEdit
Second option is using onSubmitEdit
Make a custom function that controls what return button should do.
e.g.)
const [textInputValue, setTextInputValue] = useState("");
const returnPressed = () => {
if(need_new_line){
setTextInputValue(textInputValue+"\n");
} else {
returnFunction();
}
};
return (
<TextInput
value={textInputValue}
onChangeText={(text)=> setTextInputValue(text)}
onSubmitEditing={()=> returnPressed()}
/>
);
Is there a way to close the mobile hamburger menu when you click on a menu link? We have a menu link that launches a modal window, but the menu is still showing behind it when I close the modal.
The state of the hamburger menu is kept in HamburgerMenuService. You can inject this service in your modal for example you can call the toggle(false) method in this component's onInit hook.
This way when the modal initializes the menu will close.
Thanks for the pointers. This is how I achieved the task:
Inject the HamburgerMenuService into the component:
import { HamburgerMenuService } from ‘#spartacus/storefront’;
Add my constructor:
constructor(private hamburger: HamburgerMenuService) {}
Access the toggle method in my modal function:
this.hamburger.toggle(true); // force close
I want to customize a PivotItem to make it close-able (kind of like browser tabs).
I provided a custom onRenderItemLink implementation do display an X icon on the right side of the tab, and an onClick method on that icon that will close the tab.
The main issue I'm facing is that this PivotItem is wrapped with a button (Pivot.Base.tsx renders a Commandbutton), that intercepts all onClick events on Firefox.
Firefox does not allow onClick events under a Button (this seems to be in accordance with the standard, so it's not considered a bug), so i can never close a tab on Firefox.
Is there any way to force Fabric UI to create a div rather than a button in this scenario?
Is there any other way to force a div there (some way to intercept what fabric ui creates and switch the button with a div)?
Advice appreciated.
Ended up closing the tab if the button was clicked on its right side
const clickX = clickEvent.pageX;
const buttonRight = clickEvent.currentTarget.offsetLeft + clickEvent.currentTarget.offsetWidth ;
if (buttonRight - clickX <= 40) {
removeTab(tab);
}
When i press an input in react-native , the keyboard pops an opens.
I would like to close the keyboard (ONLY) when pressing some button.
How can i do this?
You can dismiss the keyboard by using Keyboard.dismiss.
import { Keyboard } from 'react-native';
<Touchable onPress={Keyboard.dismiss}>...</Touchable>
If you're using a ScrollView you'll need to set keyboardShouldPersistTaps prop to true.
I have a child window created in silverlight. I need to load a user control within the child window(for a content change in the same child window) on a button click.
How can i acheive this?
Say for Example: If i have a child window with a Header -> Content -> Button.
I just need to change the content part and the button part on click of the button.
I need to change the buttons also since navigation is not possible using the same button click events.
Is it possible to acheive this in Silverlight 4.0 or 5.0?
Here is one way to do it. Create a canvas to hold the content and on button click, add the user control and add it as a child to the canvas. If you want to change the button, rather than changing the button, in the same button click the button content to a different text.
private void Button_Click_1(object sender, RoutedEventArgs e)
{
SilverlightControl1 control1 = new SilverlightControl1();
top.Children.Add(control1);
}
Hope this helps.