Sencha Touch: Android Halo Light Theme

One of the things I love about Sencha Touch is the built in themes. Android has 4.x has two themes: Halo Dark, Halo Light.  There is only one Android theme for Sencha Touch and it's dark. I've been bugging them for awhile to include a light theme and their response was "You do it".

I googled for a long time and couldn't find a theme someone else did. I gave in and decided to make my own theme after finding this one. It's beautiful. I read his breakdown and he created a theme by copying the winPho theme and made changes until he was happy. I did something similar. I copied the Android theme and started digging in.

That's when I found it. There is a Sass variable in /[Sencha SDK folder]/resources/themes/stylesheets/sencha-touch/mountainview/var/_Class.scss called $dark-theme. If you set this variable to false in your local sass file for android it becomes a light theme.

I wish this was explained better. It's only through source code diving can we find the true answers.

Sencha Touch Themes: Using built-in themes for iOS and Android

One of the things I like about Sencha Touch is the built in device themes. I like being able to make a web app look native.

I found many resources that talked about the themes but none gave very good instructions on how to make them work. I finally found a video that walked you through some of the process involved in making themes work. It left out some important stuff that I found through lots of trial and even more error.

I'll show you how to apply a theme to the default sencha project. You can apply these steps to your own project.

1. Create an example app.
• sencha -sdk [path to sdk] generate app [AppName] [path]
2. You'll need to create scss files for the different platforms you want to support.
• cupertino.scss (iOS 7 styling)
• cupertino-classic.scss (iOS 6 styling) 
• mountainview.scss (Android)
3. Each of these files will include two imports lines that define our theme styles.
   
   
   @import 'sencha-touch/[platform name]';
   @import 'sencha-touch/[platform name]/all';
   
   [platform name] is the name of the style you're including. cupertino.scss will use "cupertino" and mountainview.scss will use "mountainview". All the platform names are available here under tip 2.
4. Next you'll need to run "compass compile" or "compass watch" in the resources/sass folder. 
5. Now we have to update app.json to include the new css files that were generated by compass. Look for the css option and add each platform as an object to the css array.
   {
       "path": "resources/css/cupertino.css",
       "platform": ["ios"],
       "update": "delta"
   }
   
   Make sure to update the platform value with the appropriate value. The options are available here under available platforms.
   
   IMPORTANT NOTE: Make sure to add the "platform": ['desktop'] to the app.css entry. If you don't app.css will be included in every theme and it will break the display. 
   
   
6. Lastly you'll need to run sencha app build to bring everything together. You can test the different templates by appending ?platform=[platform name] to your uri.
   eg: senchaapp.io/?platform=ios

I've added the example project to github so you can pull that down as an example.

Android : Pixelpipe unable to post video to facebook

I ran into an odd issue where PixelPipe wouldn't let me upload a video from my phone, but it would still upload pictures. I tried reauthorizing the facebook pipe on their website but it didn't help. I tried creating a new pipe and uploading through that and it still didn't work. What finally fixed the issue is reauthorizing the facebook pipe on the phone through the app.

Open Pixelpipe and goto the settings tab. Press the "Edit pipes" button.

This will take you to the list of pipes on your account. Press the combobox for facebook and press "change settings".

Scroll to the bottom of this page and press "Reauthorize this account".

It will ask for your facebook username and password. You might get dumped to a white screen with nothing on it. If this happens press the "back" device button and you should return to the Settings tab. Go back to the facebook pipe and check to see that the pipe has access to your account.

Android: Motorola Droid

This phone has caught my eye. I've had an iPhone since launch but have become a bit frustrated with it. It's a beautiful phone, but a bit of a walled garden. Android has always been interesting to me, but now it seems to be catching up with the iPhone.

I've started a wish list of things I hope the Droid will do. I'm updating it with links to articles that verify the features as time goes along.

http://spreadsheets.google.com/pub?key=tlQ3UVqx9gnphVI6h1aKTig&output=html