Upload
peter-friese
View
2.333
Download
1
Tags:
Embed Size (px)
DESCRIPTION
Developing great apps for mobile platforms like Android, iOS or mobile web is a challenging task. Not only do you have to take into consideration the limited resources your app has at it's disposal, you also have to follow the established UI idioms - which may differ on the respective platforms. In this session, I will demonstrate how you can build mobile apps with tools from the Eclipse ecosystem. Based on real-world examples I will present a domain-specific language we used to mobilize enterprise systems or to create the official Eclipse Summit Europe conference app (http://bit.ly/ese_app_de). What's more, I will show you how to overcome the tedium of having to manually port your application from one platform to other platform technologies such as Objective-C or Django/Python. Finally, I will show how to integrate Eclipse tooling with external tools such as Apple's Xcode and Google App Engine. See http://lanyrd.com/2011/eclipsecon-europe/shhmy/
Citation preview
with Eclipse
@peterfriese | http://peterfriese.dehttp://www.zuehlke.com
Cross-Platform, Native Mobile Development
cell phone usage is ubiquitous
cell phone usage is ubiquitous
we use
our phones
to mana
ge eve
ry asp
ect
of our
lives
People are !fferent
... so #ey have !fferent ta$es!
countless devices
diversity of platforms
Javapublic class SpeakersList extends GenericListActivity<Speaker> {
List<Speaker> speakers;
@Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState);
setTitle("Speakers");
speakers = getItemsFromProvider();
ArrayList<AbstractRowAdapter> rowAdapters = new ArrayList<AbstractRowAdapter>();
Iterable<Speaker> items1 = speakers; for (Speaker i : items1) rowAdapters.add(new Cell1(i));
setListAdapter(new GenericItemAdapter(this, rowAdapters)); finishCreation();
}
C#public partial class SpeakerDetailsDetailsView : PhoneApplicationPage{ public SpeakerDetailsDetailsView() { InitializeComponent(); }
protected override void OnNavigatedTo(NavigationEventArgs e) { string selectedIndex = ""; if (NavigationContext.QueryString.TryGetValue("itemByIndex", out selectedIndex)) { int index = int.Parse(selectedIndex); DataContext = App.RootViewModelProvider.BlogpostsModelProvider().BlogItems[index]; } }}
Objective-C@implementation SpeakersListViewController
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section { if(section == 0) { return [[[contentProvider valueForKeyPath:@"content"] asArray] count]; } else return 0;}
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { id item = [self.items objectAtIndex: indexPath.row]; IPContentProvider *provider = [(itemisAppProviders*)contentProvider.providers
providerForSpeakerByName: [item valueForKeyPath:@"name"]]; SpeakerDetailsViewController *controller = [[SpeakerDetailsViewController alloc] init]; controller.contentProvider = provider; [self.navigationController pushViewController: controller animated: TRUE]; [controller release];}
HTML{% extends "generated/application.html" %}{% block title%}Speakers{% endblock %}{% block content_class %}table list{% endblock %}
{% block content %}<ul>{% for s in data|to_list %} <li> {% url views.SpeakerDetailsBySpeakerByName s.name|urlencode as url %} <a href="{{ url }}"> <div class="cell_text">{{s.name|safe}}</div> </a> </li>{% endfor %}</ul>{% endblock %}
server-side web
Device
Web Browser
Backend
Web Serverexecutes application
logic
Files Database
client-side web
Device
Web Browser
Backend
DatabaseFiles
JavaScriptexecutes application logic
hybrid app
Device
Native App
Browserexecutes JavaScript
JavaScript Bridge
Request Interceptor
Interpreter
Backend
interpreted app
Device
Native App
Application Script
interpreter
Backend
Files
Database
Generator Input
Device
Native App
Logic
Backend
Files
Database
Logic
Files
Database
DatabaseFiles
Modeldescribes logic andcomplete system
Generator
generated app
App Anatomy 101
App Anatomy 101Views
App Anatomy 101CellsViews
App Anatomy 101NavigationCellsViews
App Anatomy 101EntitiesSession
titleroom
Navigation
Cells
Views
App Anatomy 101
ContentProviders
Sessiontitleroom
Entities
Navigation
Cells
Views
App Anatomy 101
ContentProviders
Sessiontitleroom
Entities
Navigation
Cells
Views
DSL for mobile
ContentProviders
Entities
Navigation
Cells
Views
NavigationtabbarApplication itemisApp {
button { title="News" icon="calendar.png" view=NewsList( CurrentTimeline() ) }
button { title= "Tue" icon= "calendar.png" view= SessionsList( Sessions("2011-11-03 ") ) }
button { title= "Speakers" icon= "person" view= SpeakersList( AllSpeakers() ) } }
Viewstableview SessionsList(Session[] sessions) { title= "Sessions" section { } }}
Cellstableview SessionsList(Session[] sessions) { title= "Sessions" section { cell Subtitle foreach items as item { details= item.title action=NewsItemDetailView(item) } }}
Entitiesentity Session { String title String id String room Date startTime Date endTime}
ContentProviderscontentprovider Sessions(String day) returns Session[] fetches XML from ("http://eclipsecon.org/ece2011?" day) selects "sessions.session"
Demo :)
«Xpand»
Grammardescribes DSL
«Xpand»Parser
Editor
TemplatesiPhone
TemplatesAndroid
EMF MM
Toolsmith’s point of view
Extending Applause
1. Create a new generator bundle
2. Provide build strategy<extension point="org.applause.lang.ui.buildstrategy"> <buildstrategy class="org.applause.lang.generator.wp7.builder.WP7BuildStrategy"> </buildstrategy></extension>
3. Provide template project
<extension point="org.applause.lang.ui.mobileplatform"> <mobileplatform name="Windows Phone 7" projectNameSuffix="WP7" templateProject="templateproject/project.zip"> </mobileplatform></extension>
@peterfriesehttp://peterfriese.dehttp://www.zuehlke.com
twitterblogcompany