Showing posts with label dev. Show all posts
Showing posts with label dev. Show all posts

2016-01-23

Level Up - GitHub: Closing issues via commit messages

GitHub Level Up: Closing issues via commit messages.

TLDR: A commit message with "Fix #1" automatically closes issue #1 when merged in repo.



2015-07-05

Level Up - Construct 2: How to use web fonts with the Text object

Just a few steps:

1. Add a Text object to one of your layouts.
2. In the corresponding event sheet, create the event System."On start of layout", then add the action for Text object called "Set web font".
3. Use Google Web Fonts to find a font you like, then click on the icon for "Quick-use". The name/Family of the font will be at the top, and scroll down to find the URL for the stylesheet of where to load the web font from.

More info:
- How to use your own web fonts
- Using web fonts in the Text object
- Manual:Text object


~ Danial Goodwin ~



2015-05-20

Level Up - Ruby on Rails: How to create a very minimal blog website (two different ways)

As I was refreshing myself with Ruby on Rails, I've decided to share these notes. To follow these steps, you don't actually need to know any Ruby or Rails, but you should have them installed already. I'm using Ruby 2.1.5p273, Rails 4.2.0, Windows 8.1, but these steps are simple enough to do on any version.

I show two different ways to create a very code minimal blog. It also demonstrates the power of of Rails scaffolding.

Using scaffold


1. Just run the following commands one after another:

    rails new quick-blog
    cd quick-blog
    rails generate scaffold post title:string body:text
    rails generate scaffold comment post_id:integer body:text
    rake db:migrate

2. To create a post or comment, make sure that the `rails server` is started. Then, in browser, navigate to `/posts/new` or `/comments`.
3. Done


Without using scaffold


1. Run `rails new very-minimal-blog`
2. Run `cd very-minimal-blog`, then `rake db:create`
3. Create the model for the posts: Run `rails generate model Post title:string body:text`
4. Run `rake db:migrate`
5. Create a controller for the posts: Run `rails generate controller Posts`
6. In that controller that was just created in `app/controllers/posts_controller.rb`, add some code so that it looks like the following:

    class PostsController < ApplicationController
      def index
        @posts = Post.all
      end

      def show
        @post = Post.find(params[:id])
      end
    end

7. In `app/views/posts/`, create a new file called `index.html.erb` and add the following code:

   

Very Minimal Blog


    <% @posts.each do |post| %>
     

<%= post.title %>


      <%= link_to "Read me", post_path(post) %>
    <% end %>

8. Create a way to get to the posts. In `config/routes.rb` add, `resources :posts`
9. In `app/views/posts/`, create a new file called `show.html.erb` and add the following code:

   

<%= @post.title %>


    <%= @post.body %>

10. Done. :)


## To create a blog post ##
1. Open Rails console by running `rails console`
2. Run `Post.create(title: "My Title", body: "This is my awesome blog post!")`


## To view the blog ##
1. Start the Rails server by running `rails server`
2. Navigate to `localhost:3000/posts`


~ Danial Goodwin ~



2015-03-02

Level Up - Android Dev: How to get started with Robolectric (Android testing)

I'm finally getting around to trying out a few different libraries that claim to make testing Android apps easier. First up is Robolectric.

For this quick walkthrough, I'm going to show how to start from scratch. You'll need no prior knowledge except for how to make a regular Android app.

In my GitHub repo: How to get started with Robolectric

~ Danial Goodwin ~



2015-02-13

Level Up - Android Dev: OneTimeAlertDialog = Android AlertDialog that only shows once for a given key

Every single one of my apps need something like this. It's boring to explain in more details what's traditionally needed to make sure an AlertDialog is only shown once. Now, with this OneTimeAlertDialog.java, it's much easier to create new AlertDialogs that are only shown once.

/** Prompt that is only shown once to user. */
OneTimeAlertDialog.Builder(this, "my_dialog_key")
        .setTitle("My Title")
        .setMessage("My Message")
        .show();

For something I use so often, I was surprised to not find a similar project on GitHub. So, I've added it: Android OneTimeAlertDialog


~ Danial Goodwin ~



2015-02-12

Level Up - Web Dev: How to get started with Polymer

Polymer:

  • A wrapper with syntactic sugar for the new HTML WebComponents W3C spec.
  • Allows easy modularization and reuse of HTML/CSS/JS code.
  • Creates more readable source files.
  • Being actively developed by Google.

The purpose of this article is to provide the basic information needed for the easiest way to get started with Polymer, including downloading creating a custom Polymer element, and reusing other elements. This article probably could have been split into three separate smaller ones, but I'm opting for a single page that can be used as a "cheat sheet". Most of this information is from the official site, but the difference is that this is shorter guide with many deletions, a few additions, and different organization.


Getting Started For The First Time

This is a quick walkthrough for how to get started with Polymer from scratch.

1. There are a few different ways to get Polymer, but the easiest is with Bower, which is a package and dependency manager for many web libraries. So, install Bower if you don't already have it.
2. Create a new directory for your web project, then run `bower init` in it using a console. There will be a few questions, in which  you can just press Enter if you don't know what to do yet. This initialization just produces a `bower.json` file, which has settings that can easily be changed later.
3. Install Polymer for the project by running `bower install --save Polymer/polymer`. This will create and fill a new directory `bower_components` with Polymer and its dependencies. Using `--save` will update the `bower.json` file by listing Polymer as a dependency. (Sidenote: To update the components in bower_components, just run `bower update`.)

Now, you can use Polymer in your project. See the section on [How To Create A Polyment Element] for a quick walkthrough on getting a simple app working.


How To Create A Polymer Element

In this quick walkthrough, you'll create and implement a simple Polymer element called `my-element`.

1. Create a new file called `my-element.html` and add the following code. Make sure the import is pointing to the valid location within the bower_components directory that was created in the previous walkthrough.



2. Use your element in `index.html`. Here's a minimal example. Note: The above `my-elements.html` was put in an `elements` directory for some organization.



3. Run the app from a web server so that the [HTML Imports](https://www.polymer-project.org/platform/html-imports.html) work correctly. For example, to run on localhost instead of remote, if you have Python 2, then you can run `python -m SimpleHTTPServer`. If you have Python 3, then you can run `python -m http.server`.

Notes about Polymer elements:

  • The name of the element must have at least one dash `-` in it. (Reason: It's part of the web component spec as to not interfere with official HTML tags.)
  • The `noscript` attribute used in the above sample code indicates that it's a simple element with no script, which allows it to be registered automatically.



How To Reuse Other Polymer Elements

First, find some elements with Bower by running `bower search Polymer`. This will show most of the elements that the Polymer team as created. For a curated list of custom elements, check out customelements.io/. For a scrape of GitHub of all the projects that mention "web component", see Component Kitchen. These instructions work for both Polymer elements and regular web components as long as they are registered with Bower, otherwise they'll have to be installed manually.

1. Install the element for your web project, for example: `bower install --save Polymer/core-ajax`. The `--save` flag is used to add that element as a dependency to the `bower.json` file. After the optional `save`, the pattern is `/`. The element will be installed to the `bower_components` directory.
2. Use that element in your layout or custom element. An import statement must also be included, for example, to edit the custom `my-element` created in the last section:



3. Run the project and enjoy how easy it is to create modular web apps and site now. If you don't see anything on the page, then make sure that all your imports are pointing to the correct place.

The best way I've found to learn about using new elements is to see the demos and look at the source code for the ones that you like.

There's plenty more details that I haven't included in this article because they weren't vital to the setup process. So, if you have any questions, the official Polymer website is a great resource or I'll be happy to try to answer any questions.

:)
~ Danial Goodwin ~



2015-01-17

Level Up - Android Dev: How to get started with AndroidAnnotations (easy) (and build Chuck Norris app)

AndroidAnnotations is an open source framework for Android. Basically, you provide Java annotations for things, and the framework will auto-generate the necessary boilerplate code so you don't have to write it yourself. Runs at compile-time! (Read: No reflection or startup time impact) And, there's a lot of code AndroidAnnotations saves you from writing manually.

For example, want to run something in a background thread? Annotate the method with `@Background`. Want to run something in the main/UI thread? (rub some bacon on it) Annotate the method with `@UiThread`.

In this article, I provide a quick walkthrough for creating a very simple Chuck Norris facts app. I'll assume that you already have basic Android knowledge (and using Android Studio + Gradle). Then, at the end, I'll explain in more details some issues/gotchas I ran into while using AndroidAnnotations for the first time, and mention other goodies.

Getting started..

2014-12-06

Level Up - Android Dev: The default emulator is horrendously slow, use Genymotion!

Many years back when I built and published my first Android apps, I only tested them on the default emulator provided by Google. And, even now, the default emulator is still too slow for my liking. It doesn't allow me to properly test apps. So, I purchased physical devices so that I would never have to touch the Android emulator again.

Genymotion provides a different take on the Android emulator. I've known about it for at least a year, but never got around to trying it because of my really bad experience with the default emulator. I've always heard that it was much faster than Google's implementation, but I didn't think an Android emulator could ever be fast enough for me compared to my physical devices.

I'm always learning something new, and today was finally time for me to learn more about Genymotion and test just how much better it is.

Results: Excellent! So much of a great experience that I had to write this blog post about it! I should have tried Genymotion when I first heard about it, and this is my message to all Android devs to also try it out now!

Sidenote: I was going to compare the default emulator with the Genymotion emulator side-by-side, but it was taking too long to load for me, whereas Genymotion startup was a breeze of fresh air. It runs without any lag. It runs faster than my old API 17 device.

Another great benefit is that Genymotion provides system images for many of the most popular devices, including Samsung Galaxy, Samsung Note, HTC One, Nexus, and more. And, they have a very convenient plugin for Android Studio to launch the emulator.

TLDR: It's fast. I have to make sure I stress that because I didn't believe how fast it would be. Genymotion's Android emulator is much faster and better experience than the default Android emulator.



Here, I even saved enough time to write a quick walkthrough for getting started. ;)


  1. Go to Genymotion.com, click "Get Genymotion".
  2. Download the free version, you'll have to sign up and confirm your email. (It's quick and it's worth it!)
  3. Install it along with VirtualBox. For Windows users, they can bundle the two together in the download. For other, you'll have to install VirtualBox separately.
  4. If you try to run it now, you might get an error that says "genymotion virtualization engine not found. Unable to load VirtualBox engine". So, just restart your computer and that fixed it for me. Some others had to enable the virtualization feature in the BIOS.
  5. Run! Fast!
  6. Now, you can click run in Android Studio and you will see an option to load the app in the Genymotion emulator that is running.

Bonus: How to Install the Genymotion Plugin for Android Studio (and, the first time you click on the installed plugin button, you'll have to add the path to where you installed it. Windows default is "C:\Program Files\Genymobile\Genymotion". Mac default is "/Applications/Genymotion.app")
~ Danial Goodwin ~



2014-12-05

Level Up - Android Studio: How to Boost Productivity By Auto-Generating Getters and Setters

A best practice in Java is to encapsulate field variables by making them private and creating a "getter" and "setter" for each of them, as needed. Doing this with many fields can be a lot of boilerplate code to write. But, thankfully, modern IDEs, like Android Studio provide ways to auto-generate code so that you don't have to manually write it.

For example, if you have a class like the following:

public class MyClass {
    private int mId;
    private String mName;
}

Instead of manually writing each accessor (getter) and mutator (setter), go to the menu and click Code->Generate.. (hotkey `alt+insert), then choose the "Getter and Setter" option.

Done. That was fast. And, it will be just as fast with 20+ fields also.

But, wait! By default, Android Studio will include that "m" prefix (stands for "member" variable) in each of the generated method names, so you'll have method names like "setmId" and "getmId". There is a quick permanent fix for this also!

Go to File->Settings->Code Style->Java->Code Generation, then type a single "m" into the "Field", "Name prefix" field. Hit apply, then you are gone. All future code generations will take those "m" prefixes for field into account. Here's a screenshot to what this sentence means visually.

So easy to save a lot of time with Android Studio

That's it for this post. There are lots of other useful code generators also. If you are doing mindless work, it's probably been automated (or should be). ;)

~ Danial Goodwin ~



2014-08-30

Level Up - Android: Speed up your Gradle build times with one-line!

Whether or not you are using Android Studio, Gradle build times are slow (especially when you don't have continuous automated builds (another discussion)).

Here's one way to improve the speed Gradle commands like `assembleRelease` is to enable the Gradle daemon. I've sped up my release builds by about 20%!

2014-07-02

Level Up - Dev: Modular Code

Modular code means that the code is easily reusable; It does not mean that the code has to all be in one file. That's what modules and libraries are for. ;)

~ Danial Goodwin ~



2014-06-18

Level Up - Dev: Integer Overflow Not Overflowing

An integer overflow (or wraparound) occurs when a number larger than the max integer value or smaller than the min integer value is tried to be stored in the integer's memory. You could imagine a circular number line.

Ex: If you have an integer at the max positive value and add one, then the integer will wraparound and be set to the most negative value (if using a signed int. An unsigned int will wraparound to 0). And, vise-versa.

Today, I experienced a bug where I wanted to get a (signed) integer overflow, but unfortunately the int value was just going to zero instead of going to the negative numbers. Thankfully, I knew the memory/bit representation of int and was able to figure out what was going on.

Here is some simplified code, with only one small change:

    // Test #1 - has wraparound
    int wrap = 1;
    for (int i = 0; i < 34; i++) {
        print(i + ": wrap: " + wrap);
        wrap = wrap * 3;
    }

    // Test #2 - no wraparound
    int wrap = 1;
    for (int i = 0; i < 34; i++) {
        print(i + ": wrap: " + wrap);
        wrap = wrap * 2;
    }

Here is the relevant output from running the code above:

// Test #1 - has wraparound
...
13: wrap: 1594323
14: wrap: 4782969
15: wrap: 14348907
16: wrap: 43046721
17: wrap: 129140163
18: wrap: 387420489
19: wrap: 1162261467
20: wrap: -808182895
21: wrap: 1870418611
22: wrap: 1316288537
23: wrap: -346101685
24: wrap: -1038305055
25: wrap: 1180052131
26: wrap: -754810903
27: wrap: 2030534587
28: wrap: 1796636465
29: wrap: 1094942099
30: wrap: -1010140999
31: wrap: 1264544299
32: wrap: -501334399
33: wrap: -1504003197

// Test #2 - no wraparound
...
20: wrap: 1048576
21: wrap: 2097152
22: wrap: 4194304
23: wrap: 8388608
24: wrap: 16777216
25: wrap: 33554432
26: wrap: 67108864
27: wrap: 134217728
28: wrap: 268435456
29: wrap: 536870912
30: wrap: 1073741824
31: wrap: -2147483648
32: wrap: 0

33: wrap: 0

If test #1 were to continue, then the values would keep wrapping. If test #2 were to continue, then the values would stay the same at 0.

The easiest way for me to make sense of this experiment was to know that multiplying by a power of 2 (2, 4, 8, 16, 32..) is the exact same as a bit shift in the binary computer. And, the bits that made up the int were all just getting pushed out of memory in test #2 until there were no more set bits to manipulate. In test #1, more int memory bits are being flipped in order to continue the wraparound.

I would explain this at a lower level, but there are already many great resources for "bit representation of integer".


~ Danial Goodwin ~

ps - This post was mainly for myself and written quickly. If there are any questions about this, then I'd be happy to elaborate.



2014-02-27

Level Up - Android Dev: How To Automatically Extract Hardcoded Strings To res/values/strings.xml

This is just one of the many refactoring features of Eclipse. Using this extract feature, you won't even need to open res/values/strings.xml to add the String resources nor manually write out reference to the resource.

This saves a lot of time, and allows the best practice of putting String constants away from the UI/Java files so that localization can be performed easier. This method I'm about to show you is especially productive because it can change all instances of that particular String to point to the xml string resource so that you don't have to do it individually one-by-one. (I'm doing maintenance on code that has everything hardcoded, so this is a lifesaver.)

To automatically extract the String, it's easy enough:

Step 1: Highlight the entire String that you would like extracted and sent to res/values*/strings.xml
Step 2: From the menu bar, select Refactor->Android->"Extract Android String..."
Step 3: Preview options and confirm changes.

Step 2: Automatically extracting string menu option.


Step 3: Many different great refactoring options to choose from.


This works in the XML and Java files for your Android application. And, this is much quicker than manually changing all instances of hardcoded Strings to getString() and @string/.


~ Danial Goodwin ~



2014-02-01

Level Up - WP Dev: How to Remove Debug Information From Windows Phone Emulator

(This post is for developers of the Windows Phone platform.)

Ever find the frame rate counters and other debug information on the Windows Phone emulator more annoying than useful? It always appears there, whether in debug mode or release mode.

What if you want to get a clean screenshot without having to edit the image later? The red and white performance information on the side of the emulator screen is a nice feature, but I haven't needed to use it much in my recent apps.

It's possible. And, you only have to change one word.

How To:
1. Open App.xaml.cs.
2. Find the line that says `Application.Current.Host.Settings.EnableFrameRateCounter = true;`.
3. Change `true` to `false`.

That's it!

Now, you can get the full/real experience that end users would get when using your app, emulator style.

Feel free to share this with other WP devs that you know.

By default, the emulator has debug information on it.


Source: http://msdn.microsoft.com/en-us/library/windowsphone/develop/gg588380(v=vs.105).aspx


~ Danial Goodwin ~



2013-12-13

Bug Fix: Windows Phone Not Detected, Can't Connect To Windows Phone Developer Registration

The Problem:
"Status: Unable to connect to a phone. For Windows Phone 7 phones make sure the Zune software is running and the Zune recognizes your phone. For Windows Phone 8 phones make sure that the Windows Phone IP Over USB Transport (IpOverUsbSvc) service is running."

The Solution:
- What worked for me was just using a regular USB cable and plugging it in directly to the computer rather than going through an USB hub.

- For many other, what works is ensuring that "Windows Phone IP Over USB Transport" (IpOverUsbSvc) is running. How to do that? Here's an easiest way: Go into start, search "Administrative Tools" -> Click "Services", then find and double-click on "Windows Phone IP Over USB Transport", and find the start or maybe even the reset button.

~ Danial Goodwin ~