Focus kendo-grid when component is displayed - kendo-grid

How can I focus kendo grid when my component (with grid) is loaded/shown/navigated? I want to navigate immediately after grid (my component) is displayed.
I tried with:
import { GridComponent } from "#progress/kendo-angular-grid";
#ViewChild(GridComponent) public grid: GridComponent;
public ngAfterViewInit(): void
{
this.grid.wrapper.nativeElement.focus();
}
But grid is not focused. Even my component is not, because event keypress is never triggered until I click one cell.
#HostListener("keyup", ["$event"])
handleKeyboardEvent(event: KeyboardEvent)

Related

How to make a click hide after certain condition (Angular 4+)?

I have a click button that is suppose to hide after certain amount of inputs.
I would like it to hide once it reaches a limit, but currently what is doing that it would only hide when it's clicked again. Which is a bad user experience.
private isAddUserVisible = true;
public limitedAmount() {
this.isAddUserVisible =
this.userL.length + this.service.getTotalLength() < this.userService.getTotalValue();
if (this.isAddUserVisible) {
this.userL.push(this.create());
}
}
<div class="add-icon-button medium-3 columns" *ngIf="this.isAddUserVisible" (click)="limitedAmount()">
Of course, we don't have the whole picture but try manually calling change detection.
Inject constructor(private ref: ChangeDetectorRef)
and then call: this.ref.detectChanges(); where appropiate
Read more about it here

Make JavaFX Button visually appear to be clicked on right click

I converted some old Java Swing code to JavaFX. The JavaFX code had explicit doClick() for the right mouse button calls:
myButton.addMouseListener(new MouseAdapter() {
#Override
public final void mousePressed(MouseEvent e) {
if (SwingUtilities.isLeftMouseButton(e)) {
// ...
}
else if (SwingUtilities.isRightMouseButton(e)) {
// ...
myButton.doClick();
}
}
});
Left clicks make the button visually appear to be clicked in Java Swing. However right clicks do not visually do this without adding myButton.doClick()
I am seeing the same visual behavior in JavaFX and I want right clicks to visually make the button look clicked. Below is my JavaFX code:
myButton.setOnMouseClicked(new EventHandler<MouseEvent>() {
#Override
public void handle(final MouseEvent event) {
if (event.getButton() == MouseButton.PRIMARY) {
// ...
}
else if (event.getButton() == MouseButton.SECONDARY) {
// ...
}
}
});
What do I have to add to make right clicks visually click myButton?
That visual appearance of button click is usually referred as "armed" pseudo state. So you can turn on/off the armed pseudo state of the button when doing right button pressed&released.
Something like..
myButton.setOnMousePressed(e->{
if(e.getButton()== MouseButton.SECONDARY){
myButton.pseudoClassStateChanged(PseudoClass.getPseudoClass("armed"), true);
}
});
myButton.setOnMouseReleased(e->{
if(e.getButton()== MouseButton.SECONDARY){
myButton.pseudoClassStateChanged(PseudoClass.getPseudoClass("armed"), false);
}
});
Updating the :armed pseudo class is not enough if you want the Button's action to be fired by a right click. You actually need to arm the Button. In other words, you need to make the armed property change to true. Also, updating the armed property will update the pseudo class for you.
As the armed property is read-only, you can't set it directly; you need to call arm() and disarm(). You may also need to manually call fire() (expanded on below). Here's an example:
Button button = new Button("Click Me!");
button.setOnAction(event -> System.out.println("Button clicked!"));
button.setOnMousePressed(event -> {
if (event.getButton() == MouseButton.SECONDARY) {
button.arm();
}
});
button.setOnMouseReleased(event -> {
if (button.isArmed()) {
button.disarm();
button.fire();
}
});
However, you don't appear to need the onMouseReleased handler at all—at least in JavaFX 11 and 12, using the default Button's skin/behavior. The Button's behavior class will fire the action if said Button is armed at the time the mouse is released (and no keys are down). Note that the default behavior class does a more complex check regarding which MouseButton was used (i.e. it does more then just check event.getButton() == MouseButton.PRIMARY). You can see the implementation for yourself here.
All that said, if you only want the visuals to change then you should use the approach shown in Sai's answer.

Angular 6+ HostListener on numeric input side arrows selector?

I am facing an issue where I have a directive sitting on an input type=number, those with side arrows for selecting numbers up and down.
I am using HostListener but I can't find a way to target the specific event when the user clicks on the side arrows.
So far I have tried:
#HostListener(change'): does not work at all
#HostListener('ngModelChange'): cause an infinite loop when the user uses the keyboard after
#HostListener('click'): It's the only one the works but the event does not contain the input value as it is a generic click event.
#HostListener('input'): Only works when the users input a number using the keyboard
Does anyone know the official way of getting this event?
#HostListener('input', ['$event'])
onEvent(event) {
this._propagateTouch();
this._propagateChange(event.target.value);
// console.log('input');
}
#HostListener('click', ['$event'])
onChange(event) {
this._propagateTouch();
this._propagateChange(event);
console.log('arrow change');
}
#HostListener('keydown', ['$event'])
handleKeyboardEvent(event) {
this._propagateTouch();
this._propagateChange(event.target.value);
}
Angular executes provided /configured method for HostListener when the element emits the configured event. There are two events change and input available for input
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number
For input when user click on side up or down arrow event get fired for #HostListener("input", ["$event"]). Demo
#HostListener("input", ["$event"])
public onInput(event: any): void {
console.log("input:"+ event);
alert(event);
}
#HostListener("input", ["$event.target"])
public onInput(event: any): void {
console.log("input:"+ event);
alert(event);
}

How to add a JPopupMenu to a JMenuBar?

I have an application with a popup menu. I'd like to use the popup in the usual way (i.e., it should appear when the user right-clicks anywhere in the window), but I'd also like to attach it to the main MenuBar at the top of the window. I'm not sure how to do this.
I'd thought it would as simple as calling
myJMenuBar.add(myPopupMenu)
but this doesn't work.
JMenuBar.add() wants a JMenu parameter, not a JPopupMenu.
Does anyone have any suggestions?
Instead of trying to reuse the JPopupMenu object, the best approach would be to encapsulate the actions that the menus perform, and reuse those. The popup would trigger those actions, as would the menu items.
From the Action JavaDoc:
In addition to the actionPerformed method defined by the ActionListener interface, this interface allows the application to define, in a single place:
One or more text strings that describe the function. These strings can be used, for example, to display the flyover text for a button or to set the text in a menu item.
One or more icons that depict the function. These icons can be used for the images in a menu control, or for composite entries in a more sophisticated user interface.
The enabled/disabled state of the functionality. Instead of having to separately disable the menu item and the toolbar button, the application can disable the function that implements this interface. All components which are registered as listeners for the state change then know to disable event generation for that item and to modify the display accordingly.
and
JPopupMenu, JToolBar and JMenu all provide convenience methods for creating a component and setting the Action on the corresponding component. Refer to each of these classes for more information.
I had the same issue. A right-mouse-click as well as a top menu with exactly the same (complicated) set of menu items. The 'Action' class is something to consider if you are talking about enablement choices, but it's not dealing with visibility and in my case there was also a dynamic list of entries based on a current selection that I wanted to reuse.
So I ended up implementing a 'Bridge' design pattern (I think) for the methods I actually use (add() and addSeparator()):
public static class MenuBridge
{
private JPopupMenu popupMenu;
private JMenu menu;
public MenuBridge(JPopupMenu popupMenu)
{
this.popupMenu = popupMenu;
}
public MenuBridge(JMenu menu)
{
this.menu = menu;
}
public void addSeparator()
{
if(popupMenu!=null) popupMenu.addSeparator();
else menu.addSeparator();
}
public void add(JMenuItem item)
{
if(popupMenu!=null) popupMenu.add(item);
else menu.add(item);
}
}
So then I can write a reusable method that computes the menu items and synchronize my right mouse click with the top-level menu:
public void addTaskMenuItems(DefaultMenu menu, List<MDProcTask> taskList)
{
...
menu.add()/menu.addSeparator()
...
}
addTaskMenuItems(new DefaultMenu(popupMenu),taskList);
...
taskMenu.addMenuListener( new MenuListener() {
public void menuCanceled(MenuEvent menuevent)
{
}
public void menuDeselected(MenuEvent menuevent)
{
}
public void menuSelected(MenuEvent menuevent)
{
taskMenu.removeAll();
addTaskMenuItems( new DefaultMenu(taskMenu),getSelectedTasks());
taskMenu.revalidate();
}});

How to prevent JPopUpMenu disappearing when checking checkboxes in it?

I want to use JCheckBoxMenuItems in a JPopupMenu. It works, but the problem is that the popup menu disappears when a checkbox item has been checked or unchecked. So if one wants to check/uncheck several items, the popup needs to be launched repeatedly, which is irritating.
Curiously, if I use just plain JCheckBox items in the menu (instead of JCheckBoxMenuItems), the behavior is just as it should be: the popup stays there and the checkboxes can be checked/unchecked. Once done, the popup can be closed just by clicking outside it.
How do I make the popup to behave like that when the items there are JCheckBoxMenuItems? I would prefer using JCheckBoxMenuItems because of their looks.
Well, found working answer from http://forums.sun.com/thread.jspa?threadID=5432911. Basically, create a custom UI:
public class StayOpenCheckBoxMenuItemUI extends BasicCheckBoxMenuItemUI {
#Override
protected void doClick(MenuSelectionManager msm) {
menuItem.doClick(0);
}
public static ComponentUI createUI(JComponent c) {
return new StayOpenCheckBoxMenuItemUI();
}
}
And set it in the JCheckBoxMenuItem:
myJCheckBoxMenuItem.setUI(new StayOpenCheckBoxMenuItemUI());
Don't know if this is the most elegant possible solution, but works perfectly.
I ran into an issue with the nice Joonas Pulakka's answer because the "UIManager lookandFeel" was ignored.
I found the nice trick below on http://tips4java.wordpress.com/2010/09/12/keeping-menus-open/
The point is to reopen immediatly the menu after it has been closed, it's invisible and keep the application look and feel and behavior.
public class StayOpenCBItem extends JCheckBoxMenuItem {
private static MenuElement[] path;
{
getModel().addChangeListener(new ChangeListener() {
#Override
public void stateChanged(ChangeEvent e) {
if (getModel().isArmed() && isShowing()) {
path = MenuSelectionManager.defaultManager().getSelectedPath();
}
}
});
}
public StayOpenCBItem(String text) {
super(text);
}
#Override
public void doClick(int pressTime) {
super.doClick(pressTime);
MenuSelectionManager.defaultManager().setSelectedPath(path);
}
}
I found a much easier solution for this problem
JCheckBoxMenuItem menuItem = new JCheckBoxMenuItem("sample");
menuItem.putClientProperty("CheckBoxMenuItem.doNotCloseOnMouseClick", Boolean.TRUE);
I found this solution while reading the code from
BasicMenuItemUI.doNotCloseOnMouseClick()