Tuesday, September 10, 2013

Re: Getting the default DateBox() picker to advance year at a time

Thanks , I am using this in my app

On Thursday, June 3, 2010 1:16:03 AM UTC+5:30, Danny Goovaerts wrote:
It's not necessary to write a custom DatePicker. It suffices to create
a DatePicker with a custom MonthSelector.
Here is my implementation
//
package eu.oobikwe.gwt.ui;

import com.google.gwt.user.datepicker.client.CalendarModel;
import com.google.gwt.user.datepicker.client.DatePicker;
import com.google.gwt.user.datepicker.client.DefaultCalendarView;

public class DatePickerWithYearSelector extends DatePicker {

        public DatePickerWithYearSelector() {
                super(new MonthAndYearSelector(),new DefaultCalendarView(),new
CalendarModel()) ;
                MonthAndYearSelector monthSelector = (MonthAndYearSelector)
this.getMonthSelector() ;
                monthSelector.setPicker(this) ;
                monthSelector.setModel(this.getModel()) ;
        }

        public void refreshComponents() {
                super.refreshAll() ;
        }

}

//
package eu.oobikwe.gwt.ui;

import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.ui.Grid;
import com.google.gwt.user.client.ui.PushButton;
import com.google.gwt.user.client.ui.HTMLTable.CellFormatter;
import com.google.gwt.user.datepicker.client.CalendarModel;
import com.google.gwt.user.datepicker.client.MonthSelector;

/**
 * A simple {@link MonthSelector} used for the default date picker.
Not
 * extensible as we wish to evolve it freely over time.
 */

public  class MonthAndYearSelector extends MonthSelector {

  private static String BASE_NAME = "datePicker" ;

  private PushButton backwards;
  private PushButton forwards;
  private PushButton backwardsYear;
  private PushButton forwardsYear;
  private Grid grid;
  private int previousYearColumn = 0;
  private int previousMonthColumn = 1 ;
  private int monthColumn = 2 ;
  private int nextMonthColumn = 3;
  private int nextYearColumn = 4 ;
  private CalendarModel model ;
  private DatePickerWithYearSelector picker ;


public void setModel(CalendarModel model) {
        this.model = model;
}



public void setPicker(DatePickerWithYearSelector picker) {
        this.picker = picker;
}



@Override
  protected void refresh() {
    String formattedMonth = getModel().formatCurrentMonth();
    grid.setText(0, monthColumn, formattedMonth);
  }

  @Override
  protected void setup() {
    // Set up backwards.
    backwards = new PushButton();
    backwards.addClickHandler(new ClickHandler() {
      public void onClick(ClickEvent event) {
        addMonths(-1);
      }
    });

    backwards.getUpFace().setHTML("‹");
    backwards.setStyleName(BASE_NAME + "PreviousButton");

    forwards = new PushButton();
    forwards.getUpFace().setHTML("›");
    forwards.setStyleName(BASE_NAME + "NextButton");
    forwards.addClickHandler(new ClickHandler() {
      public void onClick(ClickEvent event) {
        addMonths(+1);
      }
    });


    // Set up backwards year
    backwardsYear = new PushButton();
    backwardsYear.addClickHandler(new ClickHandler() {
      public void onClick(ClickEvent event) {
        addMonths(-12);
      }
    });

    backwardsYear.getUpFace().setHTML("«");
    backwardsYear.setStyleName(BASE_NAME + "PreviousButton");

    forwardsYear = new PushButton();
    forwardsYear.getUpFace().setHTML("»");
    forwardsYear.setStyleName(BASE_NAME + "NextButton");
    forwardsYear.addClickHandler(new ClickHandler() {
      public void onClick(ClickEvent event) {
        addMonths(+12);
      }
    });

    // Set up grid.
    grid = new Grid(1, 5);
    grid.setWidget(0, previousYearColumn, backwardsYear);
    grid.setWidget(0, previousMonthColumn, backwards);
    grid.setWidget(0, nextMonthColumn, forwards);
    grid.setWidget(0, nextYearColumn, forwardsYear);

    CellFormatter formatter = grid.getCellFormatter();
    formatter.setStyleName(0, monthColumn, BASE_NAME + "Month");
    formatter.setWidth(0, previousYearColumn, "1");
    formatter.setWidth(0, previousMonthColumn, "1");
    formatter.setWidth(0, monthColumn, "100%");
    formatter.setWidth(0, nextMonthColumn, "1");
    formatter.setWidth(0, nextYearColumn, "1");
    grid.setStyleName(BASE_NAME + "MonthSelector");
    initWidget(grid);
  }

  public void addMonths(int numMonths) {
            model.shiftCurrentMonth(numMonths);
            picker.refreshComponents();
          }

}

Danny
On Jun 2, 8:31 pm, Jim Douglas <jdoug...@basis.com> wrote:
> No, it's not possible, short of writing a custom DatePicker.  You
> might want to vote for this open issue:
>
> http://code.google.com/p/google-web-toolkit/issues/detail?id=3520
>
> On Jun 2, 9:24 am, Rob Tanner <caspersg...@gmail.com> wrote:
>
>
>
> > Hi,
>
> > I'm using a DateBox() widget for users to enter their date of birth.
> > When the picker is displayed, on either side of the month/year
> > displayed in the center top of the picker are the greater than and
> > less than arrows for moving forward or backward, month at a time.  I
> > have not figured out anyway to add year at a time as well (25 or more
> > years of moths is a lot of clicks).  Is there anyway to accomplish
> > that?
>
> > Thanks,
> > Rob

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/groups/opt_out.

No comments:

Post a Comment