I have a list, I want to open a View/Panel when "itemtap" event is fired (i.e. when a list item is selected). How to do it? Shall I use NestedList and getDetailCard() for it?
Thanks
EDIT : I think I should use CardLayout for it.
It depends on your situation.
If the new content you are trying to display is supposed to be replacing content on the screen, that yes using the CardLayout is the best option. This would be akin to emulating something like the UISplitViewController in the iOS world, where you have a list on the left and a main view on the right in which additional content is slid onto the screen based on actions to the right list.
So, on response to 'itemtap' events in the list you would do a 'setActiveItem' call to the panel that has a layout of card layout, and a series of children panels. You could also lazily create the panels in response to the list actions and add them on the event.
Related
I am making a music application, I have it show like a mini-view of the app as the default view, and I want it to switch to a big view on a button click. The default/mini view has a panel -> sizer -> sub-sizer -> widgets. And for the big view, I have a separate sizer and panel.
The default view looks like this
And when I press the L button on bottom right, I want it to switch to big view which is supposed to look like this
The top panel is empty here, I have not added widgets to it yet. I can provide additional information if required, like code snippets and all. But I want everything to be on the same wxFrame. I have defined all widgets in the constructor, but it overrides the previous panel and sizer. Also I want to be able to switch back and forth between the 2 layouts.
For completely replacing the frame contents like this you may find wxSimplebook useful as you can then just call its ChangeSelection() method to switch pages. You will need to adjust the frame size, e.g. by calling frame->SetClientSize(book->GetBestSize()), after switching pages manually however.
I have a problem with a view/window that has a tree view on the left then a list style view on the right which displays "stuff" corresponding to the tree node selected on the right. Very similar to how windows explorer looks and works.
The "stuff" can be displayed as a list, large icons or small icons or information.
The problem I have is that if one of the tree nodes selected is a 'placeholder' node, then 'select all' is run from the Edit menu, then after that the 'delete' option in the Edit menu is greyed out even though all the items in the RHS view are marked as selected and can in fact be deleted safely.
This can be fixed by selecting away from the tree node to another node, selecting back to the same tree node, then selecting a different view: List, large icon, small icon, or info view than was originally selected.
Trace statements show me that in the second working, scenario, the items in the right hand view are being passed to a "can I delete" function whereas when things dont work it is the name of the tree view node that gets passed to the "can I delete" function. when the "can I delete" function returns true, the 'delete' option is enabled in the Edit menu and when false it isnt.
Is there a way I can force the 'focus' for want of a better word to the right hand list, info, etc view when 'select all' is selected from the Edit menu to make this work ok all the time?
I think the problem is that the Edit menu is different (context sensitive) depending on which view ('it' thinks) is active and somewhere wires are crossed and the Edit menu is being displayed for the tree view when it should be for the RHS node list view. It is figuring out how to fix this i am struggling with.
Thanks
You have problems with the MFC command routing.
Check where you placed the handler for the commands.
A command handler is searched in this sequence:
Active view
Document
Document template
Frame window
Application.
I suppose you have handler in the views, and the focus (active view ) changes
You can change the command routing i.E. in the frame and ask all views attached to the document to handle a command... you have to overwrite OnCmdMsg for this.
See more details here
I am using win32, c++.
I have a ListView & i want to disable (grey out) only some of the items from the list.
Is that possible or only whole ListView can be greyed out?
The ListView control does not have a concept of disabled items. You can simulate that appearance using custom drawing support. This Sample demonstrates how to change the text and background color of items within the list view.
You would need to go further and provide some means of determining when a disabled item is selected within the view (as the selection will continue to work).
The Windows List View Common Control does not have a disabled state for Items. If you want to do that, you will have to implement it yourself.
This is a not-trivial exercise. It's not hard to change the visible appearance using customer draw, but handling hit-testing and selection would be quite complex.
We have a list that uses a custom renderer containing a label, a checkbox and two icons (which have click events). This list needs to be made WCAG 2.0 compliant and in order to do that we need the list to be keyboard navigable.
The problem is with being able to move from one list item to the next and have the focus move to the label for the next/previous list item. Specifically, when the user enters the list using TAB button, the label for the first list item receives focus (highlighted box around text) and the entire row in the list is highlighted as the selected item.
However, when the user then presses the down arrow key to move to the next list item, the next row becomes highlighted (is now the selected item) but the focus remains on the label of the previous row (highlight still shown around label for row 1). The only way to get the focus to move to the newly selected row is to tab through the checkbox and two icons. This isn't a big deal if there are only a couple list items but would be a pain if there are 20+ rows in the list.
Is there a way to get the focus to move to the label of the newly selected row as soon as the user moves (using up/down cursor keys) to the new list item? I know a picture would help but I don't have anyway of posting a screenshot online. Any help would be greatly appreciated.
You're going to have to dig into how focus works in Flex. This is not a complete answer, but hopefully you can put together a solution that works for you. I did this about 4-5 years ago in Flex 3, but it should be similar in Flex 4.
How Focus Works in Flex
The main things to know are the FocusManager singleton class and the IFocusManagerComponent interface.
The FocusManager moves the focus around the UI based on user interactions (mouse clicks, keyboard navigation, etc.).
If a component implements the IFocusManagerComponent interface, then the FocusManager will include it in the "tab" loop and allow the component to be focused via keyboard navigation.
How Focus Works With Flex List Components
You've already stumbled onto the peculiarities of how focus works with the List component and item renderers. The Flex List components implement IFocusMangerComponent and so when you tab through the UI the FocusManager sends the focus to the list.
The List may or may not focus the item renderers. In Flex 3 you had to be using editable item renderers for this to happen, it may or may not be the same in Flex 4.
Some Ideas for Solutions to Your Problem
I think there are numerous ways to solve this. Use some combination of these techniques:
override the protected keyDownHandler() method of the List component. I don't have the code handy, but if you look at it's implementation in the List class you should be able to make your overridden version set the focus on the next renderer.
use methods of the FocusManager to find components in the tab loop: getNextFocusManagerComponent(), findFocusManagerComponent(). Check the docs there are others that will be useful. For example, when the user presses the down arrow, you can let the next item renderer get selected, then use findFocusManagerComponent() (passing in the newly selected renderer) and then tell the FocusManager to focus it with the setFocus() method. This is probably not exactly the right approach ;)
By the way, the FocusManger is a Flex singleton object, every UIComponent in Flex has a focusManager property you can use to get a reference to it.
consider disabling focus on objects that don't need to receive focus (like the Label in your item renderer). There are numerous properties to do this: focusEnabled, hasFocusableChildren, mouseFocusEnabled, tabEnabled, tabChildren etc.
consider disabling focus on the List component, but then making your item renderers implement the IFocusManagerComponent interface. Implementing the interface is simple, you just declare it in your class (there's no actual methods to implement). The tricky part will be now your item renderers need to have key down handlers (just override the protected keyDownHandler() method that all UIComponent objects have).
I think there are other techniques you can use, it's just been too long since I did this. I'd be happy to provide more help if you get stuck somehwere...
I'm working on a events board app. Events are displayed in columns at the height matching the start time and pack into the space if there is more then one overlapping. Each event is a view and I want to have a div next to the view that shows and hides on hover.
I know how to bind to mouseEnter and mouseLeave to show and hide part of the template but I want to show something adjacent to my view/template not within it.
I've already got some computed properties on the view to place the event with the correct height and width so I don't want to add the popover inside the view.
Here is something to mess with http://jsbin.com/osoner/1/edit
Seems like something simple but I want to make sure I'm doing things the Ember way.
After messing a little with your provided jsbin, here the results.
Basically what I've done was adding a new popup css declaration wich do position the popup so that it appears outside the parent view, and also moved the {{#if...}} helper into the originating view.
If you want to go more fancy, checkout this jsfiddle wich uses the twitter boostrap popover.
Hope it helps.