Disable/mask TabItem's content panel in ExtGwt - gwt

I have a TabPanel with two TabItems in ExtGwt. I want to make both the TabItem selectable/clickable but want to disable/read-only the content panel in the TabItem so that user can not perform any action like input text in the textbox or select any field etc. I tried various approaches but it didnot worked for me. I don't want to make the whole tab disable.

This answer may be useful: https://stackoverflow.com/a/2063082/1313968
An alternative approach is to disable all components in the panel, for example just pass your ContentPanel to the following method:
private void containerSetEnabled(final Container container, final boolean enabled) {
for (int widgetIndex = 0; widgetIndex < container.getWidgetCount(); ++widgetIndex) {
final Widget widget = container.getWidget(widgetIndex);
if (widget instanceof Container) {
containerSetEnabled((Container)widget, enabled);
}
else if (widget instanceof Component) {
((Component)widget).setEnabled(false);
}
}
}

Related

Storing seekbar values after drag drop process end in ListView

I have listView with drag drop functionality. I'm using ListView with custom layout- I have SeekBar and TextView in custom ListView layout. When I drag and drop each ListView items after changing SeekBar value, TextView is moving and SeekBar value is not moving.
It may be caused by Adapter. So I've share my adapter codes.
https://gist.github.com/salihyalcin/38e320726e3ab8346c50
Thanks in advance
EDIT --- My ListItem Class
class ListItem {
String textdata;
public ListItem(String textdata) {
this.textdata = textdata;
}
public boolean equals(Object o) {
ListItem ndListItemObject = (ListItem) o;
return this.textdata.equalsIgnoreCase(ndListItemObject.textdata);
}
}
** My ListView looks like image below
** Change the SeekBar value of Layer1
** Drag-Drop Layer1 and Layer2
** Layer1 and Layer2 moved but SeekBar values stay same place, they didn't moved.
I think I have an idea. First, your post is missing code snippet of the definition of NavigationDrawerFragment.ListItem class, could be helpful. I do remember that you call method swapElements in DynamicListView but other readers probably don't need to know it.
My suggestion is to save the progress value into the ListItem class, sample code below. We will depend on swapElements() to swap the 2 ListItem objects properly, along with the progress and text (layers in your case).
EDIT, code suggestion for ListItem class:
class ListItem {
String textdata;
int seekBarValue;
public ListItem(String textdata) {
this.textdata = textdata;
}
public ListItem(String textdata, int seekBarValue) {
this.textdata = textdata;
this.seekBarValue = seekBarValue;
}
...
Notes for ListItem code:
Added seekBarValue as a public data member, and another ListItem constructor for the caller's convenience.
This is what I meant by add another data member to this class.
Code snippet suggestion for the Adapter:
holder.mSeekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {
#Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
final NavigationDrawerFragment.ListItem item = myItems.get(position);
View view = (View) seekBar.getParent();
if (view != null) {
holder.text.setText(progress + "%");
item.seekBarValue = progress;
Notes:
Added code line ...item = myItems.get(position); to get the correct item in the ArrayList.
Set the progress to item.seekBarValue
You may remove these codes below unless you plan on using it, of course:
holder.mSeekBar.getTag();
holder.text.getTag();
mar.get(1,progress);

GWT - How to retrieve real clicked widget?

I have onClick event on somePanel. And I click on it and it works. But.. How to retrieve real click target? When I click on panel which is inside od somePanel it show me that I click on somePanel..
I know we have this:
Element e = Element.as( event.getNativeEvent().getEventTarget());
But i returns element - I want widget..
How to do this?
This is an old question, but both answers are wrong. If you are using a GWT EventListener and want the widget that is the source of the event, then you simply use the event.getSource() method of the event and cast it to the original object type.
Unless there is something that I am missing in the question here.
I would use the feature in gwtquery to get the widget associated with a given element: https://code.google.com/p/gwtquery/wiki/GettingStarted#Manipulating_your_widgets
Widget = $(e).widget();
The problem is that the element clicked couldn't be the element associated with the widget but a child. In this case you could use gquery selectors to traverse the dom until you get its parent widget based on some css property.
// Most gwt widgets contains a class .gwt- but this could fail
// so use a more accurate selector than the one in this example
Widget = $(e).closest("[class*='.gwt-']")
If you wanted to do it by yourself, taking a look to the method getAssociatedWidget in GQuery gives you the solution:
EventListener listener = DOM.getEventListener(e);
// No listener attached to the element, so no widget exist for this element
if (listener == null) {
return null;
}
if (listener instanceof Widget) {
// GWT uses the widget as event listener
return (Widget) listener;
}
EDITED: here you have a working example:
import static com.google.gwt.query.client.GQuery.*;
// A panel with some widgets
Panel panel = new VerticalPanel();
final HTML widget1 = new HTML("<span>Foo</span> <span>Bar</span");
final HTML widget2 = new HTML("<span>Foo</span> <span>Bar</span");
final HTML widget3 = new HTML("<span>Foo</span> <span>Bar</span");
panel.add(widget1);
panel.add(widget2);
panel.add(widget3);
// we need to wrap our panel with a widget supporting click events
FocusPanel wrapper = new FocusPanel();
wrapper.add(panel);
RootPanel.get().add(wrapper);
wrapper.addClickHandler(new ClickHandler() {
public void onClick(ClickEvent event) {
// The element is not the HTML widget clicked but the span element
Element e = event.getNativeEvent().getEventTarget().cast();
// Using gquery to get the closest widget to the clicked element
// We take advanrage of HTML widgets having gwt-HTML class
Widget w = $(e).closest(".gwt-HTML").widget();
if (w == widget1) {
Window.alert("Clicked on widget 1");
} else if (w == widget2) {
Window.alert("Clicked on widget 2");
} else if (w == widget3) {
Window.alert("Clicked on widget 3");
} else {
Window.alert("Clicked on a non GWT HTML widget");
}
}
});
An alternative approach, if you already know all of the widgets that you want to check against, would be to use the DOM.isOrHasChild(Element) or Element.isOrHasChild(Node).
For example:
public void onClick(ClickEvent event) {
Element targetElem = Element.as(event.getNativeEvent().getEventTarget());
Widget targetWidget = null;
if (widgetA.getElement().isOrHasChild(targetElem) {
targetWidget = widgetA;
}
else if (widgetB.getElement().isOrHasChild(targetElem) {
targetWidget = widgetA;
}
.....
if (targetWidget != null) {
// You found you widget - Yay!
}
else {
// No widget found - Bummer!
}
}
This approach only works if you know the widgets you are testing against up front. The benefit is that you now have an particular widget reference rather then a generic reference to 'some' widget that you might have to do additional checks against.
For example, you could have done the following if widgetA was a subclass of TextBox called MySpecialTextBox:
MySpecialTextBox widgetA;
if (widgetA.getElement().isOrHasChild(targetElem) {
widgetA.someSpecialMethod();
}

Android spinner adapter setDropDownViewResource custom layout with radiobutton

I use Spinner in Dialog Mode.
I set SimpleCursorAdapter for the Spinner with setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
That works fine.
Now instead of simple_spinner_dropdown_item I'm trying to pass my custom layout it does work well too.
But there is a but... it does not have radio button that original simple_spinner_dropdown_item does.
Is it possible to add radio button inside of my custom spinner_dropdown_item that would be selected when spinner dialog is shown?
yes its possible but you have to define a another class for spinner.Just look at this
you have one more option to get your requirement. that is Alert dialog
just check out this Alert Dialog Window with radio buttons in Android and How to create custom and drop down type dialog and Dialog in android
Well I have found solution. ListView (what is inside of the spinners dialog) will check if your View is Checkable and call setChecked. Since android.R.layout.simple_spinner_dropdown_item is checkable it works.
So for my custom List item i have created LinearLayout that implements Checkable
public class CheckableLinearLayout extends LinearLayout implements Checkable
{
private boolean _isChecked = false;
public CheckableLinearLayout(Context context)
{
super(context);
}
public CheckableLinearLayout(Context context, AttributeSet attrs)
{
super(context, attrs);
}
#Override
public void setChecked(boolean checked)
{
_isChecked = checked;
for (int i = 0; i < getChildCount(); i++)
{
View child = getChildAt(i);
if (child instanceof Checkable)
{
((Checkable) child).setChecked(_isChecked);
}
}
}
#Override
public boolean isChecked()
{
return _isChecked;
}
#Override
public void toggle()
{
_isChecked = !_isChecked;
}
}
So ListView calls setChecked and I propagate that down to children views and my CheckBox / RadioButton will get checked / unchecked correctly.

popuppanel show up beneath the widget

I am new to GWT and the web stuff.
I am working out my own project based on
http://code.google.com/p/cloud-tasks-io/source/browse/#svn%2Ftrunk%2FCloudTasks-AppEngine%2Fsrc%2Fcom%2Fcloudtasks%2Fclient
I am trying to use popup/dialog. The popup and dialog always show behind the widget. I keep googling around and the most relevant I found is this
http://groups.google.com/group/gwt-google-apis/browse_thread/thread/40db4fcbe10d2060 which does not provide any answer. Anyway, I have 3rd party library, bst-player 1.3, which uses flash. So I disabled it(later remove it too), the popup just won't come to the top! It is still hiding behind the widget.
I have learned that popuppanel/dialogpanel alikes do not need to get added to another widget. A different way of saying is that it is not a normal widget in a sense that it cannot attach to a parent but it attaches itself to the dom to guarantee being on top (from GWT composite widget )
I am at my wit end and I am here at SO ...
UPDATE
Here is my Popup class
public class PopUp {
static PopupPanel simplePopup;
public static void init() {
simplePopup = new PopupPanel(true);
simplePopup.hide();
simplePopup.setVisible(false);
// DOM.setIntStyleAttribute(simplePopup.getElement(), "zIndex", 3);
}
public static void showpopupmsg(String msg, int left, int top) {
if (simplePopup == null) {
init();
}
if (msg != null && !msg.equalsIgnoreCase("")) {
simplePopup.ensureDebugId("cwBasicPopup-simplePopup");
simplePopup.setWidget(new HTML(msg));
simplePopup.setVisible(true);
simplePopup.setPopupPosition(left, top);
simplePopup.setWidth("475px"); //575
simplePopup.setGlassEnabled(true);
simplePopup.show();
}
}
public static void show(String message){
if (simplePopup == null) {
init();
}
simplePopup.setGlassEnabled(true);
simplePopup.setTitle(message);
simplePopup.center();
}
}
Here is how I am calling
tasksTable.doneColumn.setFieldUpdater(new FieldUpdater<TaskProxy, Boolean>() {
public void update(int index, TaskProxy task, Boolean value) {
String msg = "Here is the popup. All the way underneath";
Widget source = tasksTable;
int left = source.getAbsoluteLeft() - 50;
// source.getAbsoluteLeft() + 25;
int top = source.getAbsoluteTop() - 25;
PopUp.showpopupmsg(msg, left, top); //Here is the calling method
TaskRequest request = requestFactory.taskRequest();
TaskProxy updatedTask = request.edit(task);
updatedTask.setDone(value);
request.updateTask(updatedTask).fire();
}
});
Here is how the Popup is beneath the widget.
The source of the problem has been quite elusive since I am still new to the webapp, yet, I finally solve it myself. The culprit is the CSS. It is defining the z-index for the whole thing to quite high as seen in the following code line 1333.
http://code.google.com/p/cloud-tasks-io/source/browse/trunk/CloudTasks-AppEngine/war/CloudTasks.css#1333
I have doubted about the z-index before and try it out with a paltry value 3 as seen in the commented out code segment of Popup class in question. I have to uncomment it and set it to 101.
DOM.setIntStyleAttribute(simplePopup.getElement(), "zIndex", 101);
I was , you know, #$%###$*.
z-index is only decides which widget should show on top..
the widget popup is under benath might be having z-index value high.
set the z-index for popup thru css (recomended) or DOM will work for you
According to my feeling, using static methods of your "PopUp" object is a bit strange...
In that way, I think things a relative to the top rather than caller object.
Maybe you could consider make your class 'Popup' extending 'popupanel'
and in your calling code, just make
new PopUp(msg,left,top).show() ;
I recently wrote my own solution for a popup panel that needs to be aligned with its caller. The solution consists out of an PopupPanel extension and a Button extension.
The button extension has an instance of the panel extension, and the moment it is clicked it gives its coordinates and width and height to its panel.
#Override
public void onClick(ClickEvent event) {
if (optionsPanel.isShowing()) {
optionsPanel.hide();
} else {
optionsPanel.setButtonBounds(new Bbox(
getAbsoluteLeft(), getAbsoluteTop(), getOffsetWidth(), getOffsetHeight()));
optionsPanel.show();
}
}
(The Bbox class is just a convenience class I could use for wrapping coordinates; write your own class or 4 methods for that matter)
The main work is then done in the onLoad() override of the PopupPanel, in which the coordinates of the button are used to position the panel;
#Override
protected void onLoad() {
super.onLoad();
if (null == bounds) {
super.hide();
} else {
left = (int) bounds.getX();
top = (int) bounds.getMaxY();
setPopupPosition(left, top);
}
}
(bounds are the coordinates of the button; getMaxY() == bottom coordinate of button)

How to programmatically open a gwt listbox?

I have a user form with a lot of gwt listbox. The form is like an excel form with named list.
It's ugly and the arrows take place.
I would like the cells were like in excel. The arrow appears only when you click in the cell.
I start to program my own widget with a textbox and a listbox embedded into a DeckPanel, switching when you click on the textbox or when the value change. But with this solution, it is necessary to click again to open the listbox.
Now, it will be great, if when you click on the textbox, the listbox will be displayed already open.
In the code below, I try to do this into the method onClick wih this line:
DomEvent.fireNativeEvent(event.getNativeEvent(), listBox);
But it has no effects.
public class CustomListBox extends Composite implements ClickHandler,
ChangeHandler, HasChangeHandlers {
private final StringListBox listBox;
private final TextBox textBox;
private final DeckPanel panel;
public CustomListBox() {
textBox = new TextBox();
textBox.addClickHandler(this);
textBox.setReadOnly(true);
listBox = new StringListBox();
listBox.addChangeHandler(this);
panel = new DeckPanel();
panel.add(textBox);
panel.add(listBox);
panel.showWidget(0);
// All composites must call initWidget() in their constructors.
initWidget(panel);
}
#Override
public void onClick(ClickEvent event) {
Object sender = event.getSource();
if (sender == textBox) {
panel.showWidget(1);
DomEvent.fireNativeEvent(event.getNativeEvent(), listBox);
}
}
public void addItem(String item) {
listBox.addItem(item);
}
public int getSelectedIndex() {
return listBox.getSelectedIndex();
}
public String getItemText(int selectedIndex) {
return listBox.getItemText(selectedIndex);
}
#Override
public HandlerRegistration addChangeHandler(ChangeHandler handler) {
return listBox.addChangeHandler(handler);
}
#Override
public void onChange(ChangeEvent event) {
Object sender = event.getSource();
if (sender == listBox) {
textBox.setText(getItemText(getSelectedIndex()));
panel.showWidget(0);
}
}
}
Since you are already programming your own widget, why don't you go all the way. Don't swap out the text box for a list box widget. Instead of a textbox use a label. Add an arrow to your label background when you mouse over, then use a popupPanel for the list itself. In the popupPanel you can make the list items whatever you like, just make sure when you click on it, it sets the text in your original label.