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 ~
Showing posts with label walkthrough. Show all posts
Showing posts with label walkthrough. Show all posts
2015-03-02
2015-02-12
Level Up - Web Dev: How to get started with Polymer
Polymer:
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.
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.
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:
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 ~
- 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 `
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 ~
2014-11-17
Level Up - Android: How to Root Nexus 4 on Android Lollipop 5.0 (Easy)
In my last post, I explained how to flash Android Lollipop 5.0 system image to Nexus 4. After I did that to my own device, the next thing I did was root it, using fewer steps than that other post. ;)
This will be a quick walk-through for the steps I took to root my Nexus 4. These directions are extended from the site with the great "CF-Auto-Root" tool that we will use.
Prerequisites:
Walk-though for rooting the Nexus 4:
~ Danial Goodwin ~
 |
| Rooted Nexus 4 on Android Lollipop 5.0 |
This will be a quick walk-through for the steps I took to root my Nexus 4. These directions are extended from the site with the great "CF-Auto-Root" tool that we will use.
Prerequisites:
- I assume that your bootloader is unlocked. If not, please see my previous post for how to unlock the bootloader.
- I assume you have `adb` added to your environment variable PATH. If not, please see my previous post.
- I assume you are running Windows, but Max and Linux users will be able to use these general directions also.
Walk-though for rooting the Nexus 4:
- Download the LGE Nexus 4 Android 5.0 file from http://autoroot.chainfire.eu/#fastboot
- Unzip the file. You should see two folders and three files in that folder, one should be called "root-windows.bat".
- Connect your Nexus 4 device to computer, then run `adb reboot-bootloader` in your computer's terminal. This will bring your device to the "fastboot" mode.
- Make sure again that your bootloader is unlocked before proceeding (label found at bottom-left).
- Open your computer's terminal to where you downloaded and unzipped the file, and run `root-windows` (Mac and Linux users use your own variant). You should see a red Android if the process is working.
Congrats! When the script is done, it will reboot your device and your Nexus 4 will be rooted!
This process will install the Root Check app so that you can verify a successful root.
More info:
- I didn't have any trouble using these directions for rooting my Nexus 4, so if you have any troubles with the steps, then I'll try to help in my limited capacity.
- Previously, when I was running Android 4.4 rooted, I used ES File Explorer to browse the root directories. But, it didn't work in Android 5.0, so instead I am now using the Root Browser app successfully.
~ Danial Goodwin ~
Level Up - Android: How to Flash (Upgrade) Nexus 4 to Android Lollipop 5.0 (Easy)
If you have a Nexus 4, then you can have Android Lollipop now! Google recently released the factory image, and I'm now successfully running it (with root, which will be explained in a later post).
This will be a short walk-through because I assume you already have the tools needed, but just need the steps to get the flash done. If you have any questions, then please write a comment and I will update as necessary.
Congrats! When the script is done, it will reboot your device and Lollipop will be running. It may take a bit for it to boot the first time.
More info: There sure is a lot more information you could read about this entire process, but that's not what this post is for. These are the minimal instructions (with appropriate warning) for most people wanting to do this. If anybody has some good resources to share, then please add them to the comments.
Now, are you ready to root your Nexus 4?
:)
~ Danial Goodwin ~
 |
| Nexus 4 running Android Lollipop 5.0 |
- Download Android Lollipop 5.0 factory image: https://developers.google.com/android/nexus/images#occam
- Uncompress the file, possibly twice. I used 7-zip. You should see six files there, including a zip, which you do not have to unzip.
- Make sure `adb` is in your PATH environment variable, which can be found in %android-sdk%/platform-tools/. Also, you will need `fastboot.exe` from that same folder in your PATH. (I assume you already have the Android SDK and you know what I mean by "Advanced system settings"->Environment Variables->PATH.)
- Connect your Nexus 4 device to computer, then run `adb reboot-bootloader` in your computer's terminal. This will bring your device to the "fastboot" mode.
- At the very bottom-left, you should be able to see whether your bootloader is locked or unlocked. It must be unlocked to flash a new system image. If unlocked, you're good, go to the next step. If locked, then run `fastboot oem unlock`. WARNING: Unlocking will erase all data.
- Open your computer's terminal to where you downloaded and uncompressed the files, and run `flash-all`. That command will run the "flash-all.bat" script which will setup the new system image for you!
Congrats! When the script is done, it will reboot your device and Lollipop will be running. It may take a bit for it to boot the first time.
More info: There sure is a lot more information you could read about this entire process, but that's not what this post is for. These are the minimal instructions (with appropriate warning) for most people wanting to do this. If anybody has some good resources to share, then please add them to the comments.
Now, are you ready to root your Nexus 4?
:)
~ Danial Goodwin ~
2014-08-18
Level Up - Android: How to get started with Unit Testing in Android Studio
Recently, I finally got around to implementing the native unit testing that is provided within Android Studio (not third-party programs like Robolectric). So, after reading a few different sources, the following is the bare minimum that I would have needed in order to add the basic testing features.
2014-02-09
Level Up - Webmaster: Setting Up Your First Laravel Website Or App
(For webmasters, a continuation on my last post Level Up - Webmaster: Installing Laravel and Composer on Bluehost.)
This walkthrough contains all the instructions I would have needed on one page, rather than looking through twenty different pages. This is a blunt how-to for connecting to a database with Laravel and displaying information. At the end are links for more specific and advanced info.
The following has explicit instructions and commands for a shared hosting provider like Bluehost, but the instructions should be the roughly the same for other providers and setups. I suggest to follow the steps explicitly the first time through, then run through it a second time with your specific project's names.
0. This simple "tutorial" assumes that you already know a little bit about Laravel and have possibly read my first install and setup walkthrough.
Setup the database:
1. Create a database on your server with a user and password.
2. From your root project folder, edit app/config/database.php to match your new database credentials.
3. In your root project directory, run php-cli artisan migrate:make create_users_table
8. Create two new views in app/views. Call the first one layout.blade.php and add this code:
@yield('content')
Create the second view, called users.blade.php:
@extends('layout')
@section('content')
@foreach($users as $user)
{{ $user->name }}
@endforeach
@stop
9. Go to your doman.com/users and you should have all the user names from the database displayed on the page.
This walkthrough contains all the instructions I would have needed on one page, rather than looking through twenty different pages. This is a blunt how-to for connecting to a database with Laravel and displaying information. At the end are links for more specific and advanced info.
The following has explicit instructions and commands for a shared hosting provider like Bluehost, but the instructions should be the roughly the same for other providers and setups. I suggest to follow the steps explicitly the first time through, then run through it a second time with your specific project's names.
0. This simple "tutorial" assumes that you already know a little bit about Laravel and have possibly read my first install and setup walkthrough.
Setup the database:
1. Create a database on your server with a user and password.
2. From your root project folder, edit app/config/database.php to match your new database credentials.
3. In your root project directory, run php-cli artisan migrate:make create_users_table
4. You should now have the file that looks something like: app/database/migrations/2014_02_09_195357_create_users_table.php. Edit the up() and down() function to look like:
public function up()
{
Schema::create('users', function($table)
{
$table->increments('id');
$table->string('email')->unique();
$table->string('name');
$table->timestamps();
});
}
public function down()
{
Schema::drop('users');
}
5. Now, back in the project root dir, run: php-cli artisan migrate
6. At this time, your tables in the database will be automatically created. Add some data manually so that we can test that retrieving data works.
Create a view:
7. Create a route (subdirectory pointer) in app/routes.php by adding the following code:
Route::get('users', function()
{
$users = User::all();
return View::make('users')->with('users', $users);
});
Laravel Quickstart
@yield('content')
Create the second view, called users.blade.php:
@extends('layout')
@section('content')
@foreach($users as $user)
{{ $user->name }}
@endforeach
@stop
9. Go to your doman.com/users and you should have all the user names from the database displayed on the page.
Note:
- If the php-cli command doesn't work for you, then try just php
More info:
More info:
2014-02-08
Level Up - Webmaster: Installing Laravel and Composer on Bluehost
These steps will get you though getting Laravel up and running on your Bluehost server, though these instructions should be a good enough how-to for other shared hosting providers as well.
This was my first time experiencing (and hearing of) Laravel and Composer and had to look at many websites to figure this information out. Below is a walkthrough of all the steps I would have needed in one location. For more advanced and specific informations, I provide links at the end. But, the steps shown should be enough to get going quickly from scratch.
1. SSH into your server at ~/bin/
2. Ensure that you have PHP 5.3.7+ on your server. Composer requires 5.3.2+ and Laravel requires PHP 5.3.7+. You can check with which php and which php-cli
3. Install Composer: Run the command curl -s http://getcomposer.org/installer | php
Note: Step 5 may take a minute or two, there are many dependencies that have to also be installed for Laravel.
Extra steps
6. Look at this file for project-specific adjustable values: app/config/app.php and bootstrap/paths.php
7. See my next post for more walkthrough
More info:
- Laravel installation instructions
- Laravel configuration instructions
- Then, the Quickstart
Error: "warning: composer should be invoked via the CLI version of PHP, not the cgi-fcgi SAPI"
Fix: Use the command php-cli instead of php.
~ Danial Goodwin ~
This was my first time experiencing (and hearing of) Laravel and Composer and had to look at many websites to figure this information out. Below is a walkthrough of all the steps I would have needed in one location. For more advanced and specific informations, I provide links at the end. But, the steps shown should be enough to get going quickly from scratch.
1. SSH into your server at ~/bin/
2. Ensure that you have PHP 5.3.7+ on your server. Composer requires 5.3.2+ and Laravel requires PHP 5.3.7+. You can check with which php and which php-cli
3. Install Composer: Run the command curl -s http://getcomposer.org/installer | php
4. Test that the installation worked by running php-cli composer.phar
5. Install Laravel: Run the command php-cli composer.phar create-project laravel/laravel --prefer-distNote: Step 5 may take a minute or two, there are many dependencies that have to also be installed for Laravel.
Extra steps
6. Look at this file for project-specific adjustable values: app/config/app.php and bootstrap/paths.php
7. See my next post for more walkthrough
More info:
- Laravel installation instructions
- Laravel configuration instructions
- Then, the Quickstart
Error: "warning: composer should be invoked via the CLI version of PHP, not the cgi-fcgi SAPI"
Fix: Use the command php-cli instead of php.
~ Danial Goodwin ~
2013-07-14
How To Programmatically Batch Resize A Folder Of Images
(This post gives a walkthrough on how to automatically resize a bunch of pictures at once. I provide four different ways to do the resizing, in order of least optimal to most optimal IMO. There may be more ways for programmatically resizing, but I'll most likely be using the fourth method below all of the time.)
1. ImageMagick
2. IrfanView
2.1. Benefits
2.2. Limitations
2.3. Walkthrough
3. Photoshop's Automate Batch
3.1. Benefits
3.2. Limitations
3.3. Walkthrough
4. Photoshop's Scripts Image Processor
4.1. Benefits
4.2. Limitations
4.3. Walkthrough
--
1. ImageMagick: Allows you to run image processing in a Windows command windows. So, you must be comfortable creating BAT (batch) files. I did not use this method, but here's the documentation for batch resizing this way: http://www.imagemagick.org/Usage/windows/
2. IrfanView: When I tried this method, I got the feeling this tool was very old, but it still seems to be regularly updated. Also, IrfanView has many image manipulation features available for it. Many of them seem useful, but this time I was only interested in the resize feature.
2.1. Benefits: Very lightweight program at 2MB.
2.2. Limitations: When I tried to batch resize, each of the images lost their alpha transparencies, and the backgrounds all turned black.
2.3. Walkthrough: Drag a selection of images into the screen, then in the menu bar, choose Image-->Resize/Resample
3. Photoshop's Scripts Image Processor:
3.1. Benefits: Quick to being resizing without having to setup anything else.
3.2. Limitations: Only resizes to JPG, PSD, or TIFF files. There was no option to save as PNG, which is what I needed.
3.2. Walkthrough: Menu bar --> File --> Scripts --> Image Processor. Then the window that pops up allows you to choose the folder of images you want to manipulate and where to save them.
4. Photoshop's Automate Batch: Basically, with this method, you change one image whatever way you want to, then record those steps, then you are able to perform all of those steps for a folder of images.
4.1. Benefits: Very versatile! The recorded actions you create will always be available in the future, and easy to manipulate for future projects.
4.2. Limitations: Just requires a little more setup before starting the batch image process.
4.3. Walkthrough:
Step 1. Open Action Window.
Step 2. Create New Action. Before you can record some actions, you must have an image open. It doesn't matter if it is just a new blank image, or one you would eventually edit anyways. One other useful feature is the ability to stop and record actions at any time.
Step 3. Open Batch Window.
Step 4. Setup and Start Batch Command. In the first section (Play), choose the action you would like to perform to all your images that you will choose in the second section (Source). In the third section (Destination), you can either replace all of the images or save the manipulated images in a new folder. After all that, choose the "OK" button located at the top right.
Feel free to post any questions or comments about programmatically resizing many images.
~ Simply Advanced ~
1. ImageMagick
2. IrfanView
2.1. Benefits
2.2. Limitations
2.3. Walkthrough
3. Photoshop's Automate Batch
3.1. Benefits
3.2. Limitations
3.3. Walkthrough
4. Photoshop's Scripts Image Processor
4.1. Benefits
4.2. Limitations
4.3. Walkthrough
--
1. ImageMagick: Allows you to run image processing in a Windows command windows. So, you must be comfortable creating BAT (batch) files. I did not use this method, but here's the documentation for batch resizing this way: http://www.imagemagick.org/Usage/windows/
FOR %a in (*.jpg) DO convert %a -resize 50% small_%a
ImageMagick Example
2. IrfanView: When I tried this method, I got the feeling this tool was very old, but it still seems to be regularly updated. Also, IrfanView has many image manipulation features available for it. Many of them seem useful, but this time I was only interested in the resize feature.
2.1. Benefits: Very lightweight program at 2MB.
2.2. Limitations: When I tried to batch resize, each of the images lost their alpha transparencies, and the backgrounds all turned black.
2.3. Walkthrough: Drag a selection of images into the screen, then in the menu bar, choose Image-->Resize/Resample
 |
| IrfanView: Program when opened |
 |
| IrfanView: Menu bar --> Image --> Resize/Resample |
3. Photoshop's Scripts Image Processor:
3.1. Benefits: Quick to being resizing without having to setup anything else.
3.2. Limitations: Only resizes to JPG, PSD, or TIFF files. There was no option to save as PNG, which is what I needed.
3.2. Walkthrough: Menu bar --> File --> Scripts --> Image Processor. Then the window that pops up allows you to choose the folder of images you want to manipulate and where to save them.
 |
| Photoshop's Scripts Image Processor |
4. Photoshop's Automate Batch: Basically, with this method, you change one image whatever way you want to, then record those steps, then you are able to perform all of those steps for a folder of images.
4.1. Benefits: Very versatile! The recorded actions you create will always be available in the future, and easy to manipulate for future projects.
4.2. Limitations: Just requires a little more setup before starting the batch image process.
4.3. Walkthrough:
Step 1. Open Action Window.
 |
| Photoshop: Open Action Window |
Step 2. Create New Action. Before you can record some actions, you must have an image open. It doesn't matter if it is just a new blank image, or one you would eventually edit anyways. One other useful feature is the ability to stop and record actions at any time.
 |
| Photoshop: Create New Action |
 |
| Photoshop: Saved New Action. List of available actions. |
Step 3. Open Batch Window.
 |
| Photoshop: Open Batch Window |
Step 4. Setup and Start Batch Command. In the first section (Play), choose the action you would like to perform to all your images that you will choose in the second section (Source). In the third section (Destination), you can either replace all of the images or save the manipulated images in a new folder. After all that, choose the "OK" button located at the top right.
 |
| Photoshop: Setup Batch Command |
Feel free to post any questions or comments about programmatically resizing many images.
~ Simply Advanced ~
2013-05-18
How To Get Started With Publishing Apps On Google Play
First of all, if you have never created a Google Play publisher account, then see: http://developer.android.com/distribute/googleplay/publish/register.html
That link above will walk you through the steps necessary to be able to upload apps on Google Play and start making money from them.
When creating a new account you will have to go through a few easy steps and pay $25 to setup the account. Then you should appear at a screen that looks like the following:
The options are self-explanatory. But, the first thing that you would probably want to do is set up a merchant account in the bottom-right. This is how you will be able to accept in-app purchases and create paid apps. The second step for you probably (if you aren't a developer) is to invite co-workers to the developer console in the bottom-left. This will allow you to invite by email your developer to upload the Android APK (app packages that users download and install on their device). You can also invite your graphics designer so that they may upload all of the required logos and screenshots. And either yourself or a copywriter can fill in the app description and promo description.
I will eventually create more posts that explain exactly how to perform each of the roles for the developer, designer, and copywriter. I know how to do each of these because of the many Android apps that I've successfully published. If you are also doing each aspect of the app publishing, then I highly recommend reading http://developer.android.com/design. There is a lot of highly useful information there. But, don't limit yourself to just that one great resource. It takes a lot of knowledge to have a highly successful app.
Source: http://blog.simplyadvanced.net/how-to-get-started-with-publishing-apps-on-google-play/
~ Simply Advanced ~
That link above will walk you through the steps necessary to be able to upload apps on Google Play and start making money from them.
When creating a new account you will have to go through a few easy steps and pay $25 to setup the account. Then you should appear at a screen that looks like the following:
 |
| Google Play Developer Console Home Screen |
I will eventually create more posts that explain exactly how to perform each of the roles for the developer, designer, and copywriter. I know how to do each of these because of the many Android apps that I've successfully published. If you are also doing each aspect of the app publishing, then I highly recommend reading http://developer.android.com/design. There is a lot of highly useful information there. But, don't limit yourself to just that one great resource. It takes a lot of knowledge to have a highly successful app.
Source: http://blog.simplyadvanced.net/how-to-get-started-with-publishing-apps-on-google-play/
~ Simply Advanced ~
2013-03-29
How to Save Money When Upgrading GameMaker
GameMaker is a great cross-platform game development tool. It is great for making 2D games very fast and with one code base, GameMaker can export to all major platforms, including Windows Phone, Windows 8, Android, iOS, Linux (Ubuntu), Mac, HTML5 and more. GameMaker is well worth its price.
But, I'm here to save you more money. Myself and others have purchased the GameMaker: Studio Standard version ($49) and wanted to upgrade to GameMaker: Studio Professional version ($99).
If you have purchased the standard version, then the professional version will only cost $50. What you need is your standard version's license key to save money. If you don't have it, then retrieve it at: http://www.yoyogames.com/my_licences
Then, when you go to the Buy Professional page. You can input your license key to save money on the upgrade. Click Upgrade as soon as enter the key. See picture below.
As soon as you click Upgrade the total price will be updated to show changes. Congrats, you just saved $50!
You can save money when upgrading from any [paid] version of GameMaker when using this method. This includes going from GameMaker Lite (8.1) to GameMaker: Studios.
~ Simply Advanced ~
ps - There's another deal going on now for the GameMaker: Studio Master Collection version. Typically, it is $499. But, until the March 31th, it will be on sale for $199 for Professional users. So, about $300 total. More details: http://www.yoyogames.com/news/145
But, I'm here to save you more money. Myself and others have purchased the GameMaker: Studio Standard version ($49) and wanted to upgrade to GameMaker: Studio Professional version ($99).
If you have purchased the standard version, then the professional version will only cost $50. What you need is your standard version's license key to save money. If you don't have it, then retrieve it at: http://www.yoyogames.com/my_licences
Then, when you go to the Buy Professional page. You can input your license key to save money on the upgrade. Click Upgrade as soon as enter the key. See picture below.
 |
| Save money when upgrading. |
As soon as you click Upgrade the total price will be updated to show changes. Congrats, you just saved $50!
You can save money when upgrading from any [paid] version of GameMaker when using this method. This includes going from GameMaker Lite (8.1) to GameMaker: Studios.
 |
| Official GameMaker License Upgrades Summary |
~ Simply Advanced ~
ps - There's another deal going on now for the GameMaker: Studio Master Collection version. Typically, it is $499. But, until the March 31th, it will be on sale for $199 for Professional users. So, about $300 total. More details: http://www.yoyogames.com/news/145
2013-03-23
How To Publish a Windows 8 App Using GameMaker: Studio
This post is going to be one of my longer ones, but no worries. It still contains only the minimum amount of work needed to get done before you have the ability to publish. Here's the official YoYo Games' GameMaker Setup walkthrough. http://help.yoyogames.com/entries/22361996-Setup-GameMaker-Studio-for-Windows-8
It has some good stuff, but not good enough. You'll be back here in order to successfully publish the Windows 8 app.
So, in this walkthrough, I will show you how to properly create the Windows 8 application for upload, using GameMaker: Studio.
I'll assume you already have:
1. First of all, make sure you have the proper GameMaker program. There are mainly two different ones to choose from. Choose one from http://www.yoyogames.com/gamemaker/studio and you must pay at least the $49.99 in order to publish to Windows 8. You must also have Microsoft Visual Studios 2012 installed.
2. The second biggest problem is not choosing the right target platform. Currently, you must choose "Windows 8 (Javascript)" option from the Target menu near the top (see pic below). Note: If you are using GameMaker in Windows 8, then choosing this method is the only way to save the project too. Having a target of regular Windows causes an error.
3. Third, from the menu up top, choose File->Preferences->Windows 8. You should see something that looks like the following screen.
All this was setup for me automatically because I have created a Windows 8 app before. If these fields are not inputted, then please read http://help.yoyogames.com/entries/22361996-Setup-GameMaker-Studio-for-Windows-8. I can't describe the Preferences screen better than that (towards the bottom of the link).
4. Now that the GameMaker Preferences are set up, it is time to setup you project's Global Game Settings.
This is where all other GameMaker to Windows 8 tutorials get messed up. What you need to do is open up Visual Studios 2012 and create a new basic Javascript project. It doesn't matter what you name it (for this tutorial let's call it GameMakerTest). Now, you need to reserve your app name (to ensure that it is available), associate the app with the store to get the package name, and create an app package to get the needed certificate. Where to find these options depends on if you have Visual Studios Express or Full.
4.1. To reserve your app name:
Express: In the menu bar up top: Store->Reserve App Name
Full: In the menu bar up top: Project->Store->Reserve App Name
(A new tab in your browser will open, titled "Submit an app")
Click on "App Name", which should be highlighted in blue in the middle of the screen. Then name your app. Your first choice may be taken already, so choose again. Remember this name because you will use it later back in GameMaker. Don't close this screen because you will use it again after inputting the details into GameMaker.
4.2. To associate app with the Windows Store and get the package name.
Express: In the menu bar up top: Store->Associate app with store
Full: In the menu bar up top: Project->Store->Associate app with store
Sign in with your Microsoft account. Navigate the screens and choose the one that app name that you just reserved for your GameMaker game. (Tip: The last screen shows some helpful information, like your publisher display name, if you don't remember it. You'll need to type that into GameMaker in step 5.)
4.3. To compile app and get a Windows 8 app certificate (to be used later in GameMaker):
Express: In the menu bar up top: Store->Create App Packages
Full: In the menu bar up top: Project->Store->Create App Packages
Sign in with your Microsoft account. You should see the app name that you just resevered, if not, then check the only checkbox that is there. You will need to know both the App Name and Package Identity in the Store. For this tutorial, I'm just going to say copy this information in your favorite text editor for now.
Highlight your app name that you want to submit. Click Next. Click Create. Click on the output location link so that the file explorer opens. Navigate one level up by clicking the up button. (You don't need to run the certification kit. It wouldn't work for you at this juncture anyways.)
The file you need here for GameMaker will be called_StoreKey.pfx (Ex: GameMakerTest_StoreKey.pfx). Keep this file explorer open so that you know where to find this file later in GameMaker.
5. Bring your project in GameMaker to the front again. You should still have Global Game Settings open on the Windows 8 tab. I will now walk you through what should go in each of the options.
Display Name - Put in the App Name that your reserved using Visual Studios
Package Name - Use the "Package Identity in the Store" value here. I told you to write this in your favorite text editor.
Package Display Name - Basically, the short name for your Display Name. It can be the same or a condensed version of it.
Publisher Display Name - What is your publisher display name when you created your Windows 8 Developer account? (It probably cost $49, or free if you are a student)
Version - Doesn't really matter. Just make sure it is higher than your last submission.
Each of the images that you see on this screen should be updated before publishing to Windows 8. So, go ahead and do that now. Don't close this screen yet. Come back here after you finish.
Currently, you should be in the General tab of the Windows8 tab in the Global Game Settings. On the left side, click the Installation tab. This is where you need to navigate to the PFX file (Ex: GameMakerTest_StoreKey.pfx). After you do that, click Install. Windows PowerShell will pop up and things will start to look very technical. Just read the options and continue moving forward. Close the Global Game Settings when you are done.
6. All the hard steps are finished. Now it's time to go to the menu bar, File->Create Application. Save it to your location of choice.
Navigate to the location you created the application. Click on the folder, then AppPackages. The *.appxupload is the file you will submit on the Windows website that you should still have open in your browser if you followed this walkthrough word for word.
UPDATE: After running through it again, I found out that you don't need to do step 4.3 if you do step 4.2. Associating the app with the store creates the certificate key. But, I'm leaving step 4.3 in just because it is easier to navigate to the file that way. Just know that next time you do this, you can remember where you save the project to and skip a step.
Please let me know if this walkthrough helped at all or if I should put in any more information. I spent about an hour creating this... after first learning how it do it myself which took much longer. =]
~ Simply Advanced ~
It has some good stuff, but not good enough. You'll be back here in order to successfully publish the Windows 8 app.
So, in this walkthrough, I will show you how to properly create the Windows 8 application for upload, using GameMaker: Studio.
I'll assume you already have:
- Windows 8 compatible version of GameMaker: Studio (
$49.99$0 from http://www.yoyogames.com/gamemaker/studio) - Windows 8 (http://windows.microsoft.com/en-us/windows/download-shop)
- Microsoft Visual Studios 2012 for Windows 8 (http://www.microsoft.com/visualstudio/eng/products/visual-studio-express-for-windows-8#product-express-windows)
- A Windows Store account (http://msdn.microsoft.com/en-us/windows/apps/br229512.aspx)
- Windows Developer Licence (just create a new Windows 8 project in Visual Studios and a prompt will appear to get one)
1. First of all, make sure you have the proper GameMaker program. There are mainly two different ones to choose from. Choose one from http://www.yoyogames.com/gamemaker/studio and you must pay at least the $49.99 in order to publish to Windows 8. You must also have Microsoft Visual Studios 2012 installed.
2. The second biggest problem is not choosing the right target platform. Currently, you must choose "Windows 8 (Javascript)" option from the Target menu near the top (see pic below). Note: If you are using GameMaker in Windows 8, then choosing this method is the only way to save the project too. Having a target of regular Windows causes an error.
 |
| Platform target menu circled in red |
3. Third, from the menu up top, choose File->Preferences->Windows 8. You should see something that looks like the following screen.
All this was setup for me automatically because I have created a Windows 8 app before. If these fields are not inputted, then please read http://help.yoyogames.com/entries/22361996-Setup-GameMaker-Studio-for-Windows-8. I can't describe the Preferences screen better than that (towards the bottom of the link).
4. Now that the GameMaker Preferences are set up, it is time to setup you project's Global Game Settings.
 |
| Double-click to open the Global Game Settings |
This is where all other GameMaker to Windows 8 tutorials get messed up. What you need to do is open up Visual Studios 2012 and create a new basic Javascript project. It doesn't matter what you name it (for this tutorial let's call it GameMakerTest). Now, you need to reserve your app name (to ensure that it is available), associate the app with the store to get the package name, and create an app package to get the needed certificate. Where to find these options depends on if you have Visual Studios Express or Full.
4.1. To reserve your app name:
Express: In the menu bar up top: Store->Reserve App Name
Full: In the menu bar up top: Project->Store->Reserve App Name
(A new tab in your browser will open, titled "Submit an app")
Click on "App Name", which should be highlighted in blue in the middle of the screen. Then name your app. Your first choice may be taken already, so choose again. Remember this name because you will use it later back in GameMaker. Don't close this screen because you will use it again after inputting the details into GameMaker.
4.2. To associate app with the Windows Store and get the package name.
Express: In the menu bar up top: Store->Associate app with store
Full: In the menu bar up top: Project->Store->Associate app with store
Sign in with your Microsoft account. Navigate the screens and choose the one that app name that you just reserved for your GameMaker game. (Tip: The last screen shows some helpful information, like your publisher display name, if you don't remember it. You'll need to type that into GameMaker in step 5.)
4.3. To compile app and get a Windows 8 app certificate (to be used later in GameMaker):
Express: In the menu bar up top: Store->Create App Packages
Full: In the menu bar up top: Project->Store->Create App Packages
Sign in with your Microsoft account. You should see the app name that you just resevered, if not, then check the only checkbox that is there. You will need to know both the App Name and Package Identity in the Store. For this tutorial, I'm just going to say copy this information in your favorite text editor for now.
 |
| Your names and identities will be different than mine. |
The file you need here for GameMaker will be called
5. Bring your project in GameMaker to the front again. You should still have Global Game Settings open on the Windows 8 tab. I will now walk you through what should go in each of the options.
Display Name - Put in the App Name that your reserved using Visual Studios
Package Name - Use the "Package Identity in the Store" value here. I told you to write this in your favorite text editor.
Package Display Name - Basically, the short name for your Display Name. It can be the same or a condensed version of it.
Publisher Display Name - What is your publisher display name when you created your Windows 8 Developer account? (It probably cost $49, or free if you are a student)
Version - Doesn't really matter. Just make sure it is higher than your last submission.
Each of the images that you see on this screen should be updated before publishing to Windows 8. So, go ahead and do that now. Don't close this screen yet. Come back here after you finish.
Currently, you should be in the General tab of the Windows8 tab in the Global Game Settings. On the left side, click the Installation tab. This is where you need to navigate to the PFX file (Ex: GameMakerTest_StoreKey.pfx). After you do that, click Install. Windows PowerShell will pop up and things will start to look very technical. Just read the options and continue moving forward. Close the Global Game Settings when you are done.
6. All the hard steps are finished. Now it's time to go to the menu bar, File->Create Application. Save it to your location of choice.
Navigate to the location you created the application. Click on the folder, then AppPackages. The *.appxupload is the file you will submit on the Windows website that you should still have open in your browser if you followed this walkthrough word for word.
UPDATE: After running through it again, I found out that you don't need to do step 4.3 if you do step 4.2. Associating the app with the store creates the certificate key. But, I'm leaving step 4.3 in just because it is easier to navigate to the file that way. Just know that next time you do this, you can remember where you save the project to and skip a step.
Please let me know if this walkthrough helped at all or if I should put in any more information. I spent about an hour creating this... after first learning how it do it myself which took much longer. =]
~ Simply Advanced ~
Subscribe to:
Posts (Atom)