superjames
12 Nov 2009, 8:36 AM
Hi
I'm trying to create a carousel component with a ListView as mentioned here:
http://www.extjs.com/forum/showthread.php?t=84055
My questions are:
- how to display the list horizontally ?
- how to remove the scrollbar ?
Thanks for yours anwsers.
Here's my code:
public class CarouselPanel extends HorizontalPanel
{
public CarouselPanel()
{
setBorders(true);
ListStore<CarouselModel> store = new ListStore<CarouselModel>();
store.add(new CarouselModel("/images/shortcuts/ark.png"));
store.add(new CarouselModel("/images/shortcuts/ark.png"));
store.add(new CarouselModel("/images/shortcuts/ark.png"));
final ListView<CarouselModel> lv = new ListView<CarouselModel>();
lv.setStore(store);
lv.setSimpleTemplate("<img src='{image}' border='1'/>");
lv.setPosition(10, 10);
lv.setSize(160, 60);
Button left = new Button("<");
left.addListener(Events.OnClick, new Listener<ButtonEvent>() {
public void handleEvent(ButtonEvent be) {
lv.moveSelectedDown();
}
});
Button right = new Button(">");
right.addListener(Events.OnClick, new Listener<ButtonEvent>() {
public void handleEvent(ButtonEvent be) {
lv.moveSelectedUp();
}
});
add(left);
add(lv);
add(right);
}
private class CarouselModel extends BaseModel implements Serializable
{
private static final long serialVersionUID = 1L;
public CarouselModel(String image)
{
set("image", image);
}
}
}
I'm trying to create a carousel component with a ListView as mentioned here:
http://www.extjs.com/forum/showthread.php?t=84055
My questions are:
- how to display the list horizontally ?
- how to remove the scrollbar ?
Thanks for yours anwsers.
Here's my code:
public class CarouselPanel extends HorizontalPanel
{
public CarouselPanel()
{
setBorders(true);
ListStore<CarouselModel> store = new ListStore<CarouselModel>();
store.add(new CarouselModel("/images/shortcuts/ark.png"));
store.add(new CarouselModel("/images/shortcuts/ark.png"));
store.add(new CarouselModel("/images/shortcuts/ark.png"));
final ListView<CarouselModel> lv = new ListView<CarouselModel>();
lv.setStore(store);
lv.setSimpleTemplate("<img src='{image}' border='1'/>");
lv.setPosition(10, 10);
lv.setSize(160, 60);
Button left = new Button("<");
left.addListener(Events.OnClick, new Listener<ButtonEvent>() {
public void handleEvent(ButtonEvent be) {
lv.moveSelectedDown();
}
});
Button right = new Button(">");
right.addListener(Events.OnClick, new Listener<ButtonEvent>() {
public void handleEvent(ButtonEvent be) {
lv.moveSelectedUp();
}
});
add(left);
add(lv);
add(right);
}
private class CarouselModel extends BaseModel implements Serializable
{
private static final long serialVersionUID = 1L;
public CarouselModel(String image)
{
set("image", image);
}
}
}