Skip to main content

Eclipse Community Forums
Forum Search:

Search      Help    Register    Login    Home
Home » Eclipse Projects » Remote Application Platform (RAP) » a simple implementation of swipe slider
a simple implementation of swipe slider [message #1739138] Wed, 27 July 2016 16:27
zone whua is currently offline zone whuaFriend
Messages: 7
Registered: July 2009
Location: Wuhan China
Junior Member
A swipe slider is a frequently-used control in mobile application.
here is some tips. Laughing

Frist part, we need to create a customized widget.
Step1. Select a JS slider lib. e.g. flexslider
Step2. write handler.js
after that, we get a slider, support html sliding, but we need add composite in slider.

Second part, add control to slider.
Step1. name every slide.
	public void addControl(Control control, String thumbUrl) {
		if (items == null) {
			items = new ArrayList<Map<String, String>>();
		UIToolkit.setAttribute(control, "name", "slider"+items.size());
               //rap.getObject( '", id, "' ).", $el, ".attr( '", attr, "', '", value + "' );
		Map<String, String> map = new HashMap<String, String>();
		map.put("name", "slider");
		map.put("thumb", thumbUrl);

Step2.modify handler.js, find control, move it into slide and fix css
		onRender : function() {"render", this.onRender);
			var i;
			for (i in this.setting.items) {
				var item = document.createElement("li");
				item.setAttribute("data-thumb", this.setting.items[i].thumb);
					var slider = $("[name='slider" + i + "']");
						"position" : "relative",
						"width" : "100%"

[Updated on: Wed, 27 July 2016 16:43]

Report message to a moderator

Previous Topic:RAP platform build fails on fresh clone of 3.1-maintenance
Next Topic:Get client location from browser
Goto Forum:

Current Time: Fri Oct 22 01:05:25 GMT 2021

Powered by FUDForum. Page generated in 0.02071 seconds
.:: Contact :: Home ::.

Powered by: FUDforum 3.0.2.
Copyright ©2001-2010 FUDforum Bulletin Board Software

Back to the top