M10 images example workflow

This tutorial showcases a possible workflow when editing m10 images. All basic steps from the stock apk to a themed one are covered. However, these are only the basics, so feel free to explore more of VTS and the other tutorials on this site.

Get your target fusion.apk ready and follow these steps:


 Step One: Decompile fusion.apk

  • You need to start a New project by selecting the File tab in the top left corner.
  • Then you will select M10-Project from the Create new project window. Now you should see 4 subjects on the left side of the window. Project,M10-Engine,Import,Build.
  • Select M10-Engine. Choose your sense version of the apk you are going to be working with. I’m using Sense 4.0 so thats what I selected.
  • Now select Import. Here is where you need to import your fusion.apk. Where it says file you can type the location of your apk or click the button with the 3 dots on it and navegate through your folders to your apk and then select Import.
  • Now you can go back to the Project witch is at the top left of the Create new project window. At the bottom you will need to enter your solution name. (I put fusion-test) and then click the OK button.
  • Give it a few seconds and your fusion.apk will be decompiled and ready for the next step. 

m10-solution

  

Step Two: Finding the images

 

  • Now you should see you decompiled Fusion.apk in the Solution Explorer.
  • All the images in the m10 files are always in the assets folder. The default images are in assetsDefaultdrawablesharedImages. The images for the stock skins, you will find them in there own folders named after there skin names. Such as Aluminum, Matte and so on.
  • From here you can simply hover over the file names in the Solution Explorer and a popup window of the image opens up as you hover over each file. I found this to be very nice for trying to find that one image you need without being overwhelmed with hundreds of .png’s.
  • You can also right click on the Images folder and select Open in explorer to go directly to the folder in a new window. Here’s where you can get overwhelmed. There’s close to a thousand .png files in the default shared.m10 from Sense 4.0.

m10-image-hover

 

Step Three: Editing the images

  • Edit your images with whatever program you use. (GIMP or Photoshop or whatever)
  • Once you have all your changes made. You can go back to VTS and in the Solution Explorer right click on your solution and click Reload Solution. You dont have to do this part but I always do just to make sure my changes show up in the Solution Explorer.

 

Step Four: Compile your APK

  • At the top of the screen you need go to the Home tab.
  • Next you will select Build all. This will start the process off rebuilding your .m10 files and compiling your fusion.apk (and all other projects in your solutiuon).
  • After it finished compiling, click on the Binary button in the Home tab and select your project. A new explorer window will open which shows you your freshly compiled apk.