| function convert(id){ | |
| /* | |
| * using https://github.com/rborn/TitaniumYoutubePlayer | |
| * or | |
| * https://github.com/bob-sims/ytPlayer | |
| */ | |
| Titanium.API.info('Video id ' + id); | |
| var client = Ti.Network.createHTTPClient(); |
| /** | |
| * Appcelerator Titanium Mobile | |
| * Copyright (c) 2009-2010 by Appcelerator, Inc. All Rights Reserved. | |
| * Licensed under the terms of the Apache Public License | |
| * Please see the LICENSE included with this distribution for details. | |
| */ | |
| #ifdef USE_TI_UITAB | |
| #import "TiProxy.h" | |
| #import "TiUITabProxy.h" |
| function init() { | |
| Titanium.App.addEventListener('keyboardframechanged', $.typingArea.animateKeyboard); | |
| } | |
| function scrollToBottom() { | |
| $.listView.scrollToItem(0, $.section.items.length - 1, { | |
| animated : true | |
| }); | |
| } |
This is a quick example of how to create a fading actionbar effect like this in Appcelerator Titanium
This is actually very simple. The trick is putting the Actionbar in overlay mode by configuring the theme with windowActionBarOverlay:true. Then all you need to do is updating the color of the Actionbar, in this case by scrolling a ScrollView.
| var win = Ti.UI.createWindow({ | |
| backgroundColor:'#eeeeee' | |
| }); | |
| var isAndroid = Ti.Platform.osname == "android"; | |
| var starSelectedImage = '/images/ic_star_black.png'; | |
| var starOriginalImage = '/images/ic_star_border_black.png'; | |
| //icons from Google Material Design (search for the "star" icon): https://design.google.com/icons/ | |
| var starWidth = 28; | |
| var coverView = Ti.UI.createView(); |
| var container = Ti.UI.createView({backgroundColor: "white", layout: "vertical"}); | |
| var layout = [ | |
| { | |
| title: "Parent 1", | |
| isparent: true, | |
| opened: false, | |
| sub: [ | |
| { |
| //Download and install widget loader : https://github.com/FokkeZB/nl.fokkezb.loading | |
| Alloy.Globals.loading = Alloy.createWidget("nl.fokkezb.loading"); |
| <!DOCTYPE html> | |
| <html lang="pt_br"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Ecoleta</title> | |
| <link href="https://fonts.googleapis.com/css2?family=Roboto&family=Ubuntu:wght@700&display=swap" rel="stylesheet"> | |
| <link rel="stylesheet" href="/styles/main.css"> |
| :root { | |
| --title-color: #322153; | |
| --primary-color: #34cb79; | |
| } | |
| * { | |
| margin: 0; | |
| padding: 0; | |
| } |
