Theme Material [MIT AI2]

Thanks for the hint Benjamin, that it was possible to have Theme.Material with App Inventor.

In order to get Theme.Material working with App Inventor your device must support it by having Lollipop.

Designer Properties of Screen1

Sizing: Responsive
ShowStatusBar: Checked
TitleVisible: Checked

We will control StatusBar and Title with the respective application.

ApptoMarket

Made with AppToMarket by M. Hossein Amerkashi

Downloadable files and folders to get this to work.
Framework file 1.apk.
Folders values, values-v11, values-v21 can be downloaded from here.

Launch AppToMarket

Browse for your project.

Decompile.

Select necessary features and update Manifest.

Edit manifest, add this android:theme="@style/Theme.Mytheme" for the theme in the AndroidManifest.xml file.

Save Manifest.

Before we Create New.apk.
Replace 1.apk in C:\Users\xxx\apktool\Framework\ with downloaded 1.apk.

Move downloaded folders to ..\AppToMarket_v40\temp_myDecompiles\res\ folder.

atmmove4

Theming
Each folder values, values-v11, values-v21 contains mytheme.xml file where we will change to the desired theme, and by doing that your apps will choose the theme to use depending on the device’s API.

Folder
values Theme.Light

values-11 Theme.Holo.Light
values-21 Theme.Material.Light

Create New.apk

Sign.

Verify.

Zip Align.

And that’s all….

Apk Modder v.2


Coming

Apk Modder v.1


Made with Apk Modder by Gabriele.


Launch Apk Modder

Select Apk tab and choose the Select apk to decompile.

Decompile should take a couple of seconds to be completed.

Making some changes in the Manifest file by selecting from the drop-down menus.

Build new apk.

Finalize apk.

And that’s all….

51 comments

2 pings

Skip to comment form

    • pmesystem on January 12, 2016 at 4:13 pm
    • Reply

    Can you upload folder.zip for https://drive.google.com/folderview?id=0B0jMf5z0ndLcSTlhalhNWUFCTDQ&usp=sharing unable download

      • pmesystem on January 12, 2016 at 5:42 pm
      • Reply

      I download folders.Just import ypur files to my drive.Now its work but ı have litle error.Title visible how to fix it?

      http://www.hizliresimyukle.com/image/19x
      http://www.hizliresimyukle.com/image/193

      1. I did it only with one theme, you have to make changes to mytheme.xml.

        change this in mytheme.xml
        values Theme.Light –> Theme.Light.NoTitleBar
        values-11 Theme.Holo.Light –> Theme.Holo.Light.NoActionBar
        values-21 Theme.Material.Light –> Theme.Material.Light.NoActionBar

        I’ll see if I can fix more themes

        • pmesystem on January 16, 2016 at 12:31 am
        • Reply

        Thanks for reply.Can we add this direclty to app Inventor 2? maybe new extension method help us?

        1. I have seen request of themes in the MIT Ai2 forum, however I do not know if they have made any progress and I do not think it’s possible to do it with the extension either..

  1. Love you. Forever.

    • Julian on July 11, 2016 at 5:46 pm
    • Reply

    how i download it?

    1. Hello Julian,
      This guide is somewhat old and not updated in relation to the Apk Modder, there is a new version out now of APK Modder v.2

      Forum & download: https://groups.google.com/forum/#!forum/gwayapps

    • seghier khaled on September 4, 2016 at 10:26 am
    • Reply

    didn’t work

    1. It works as it should if you followed the instructions.

      By the way, which App Inventor Distribution do you use.

        • seghier khaled on September 4, 2016 at 11:50 am
        • Reply

        i tested with app created with : MIT App Inventor 2
        Beta ,
        and with the same app compiled with : App Inventor 2 Ultimate.
        this method work for me only when i tried with applications created by : http://appybuilder.com/
        04sept.2016_1044.13: I: Loading resource table…
        04sept.2016_1044.13: ERROR: Unable to decompile your .apk file
        also when i tried with apktool ( apkstudio ) the manifest.xml didn’t have anything just few lines about the version and the name
        and original manifest file crypted

        1. 1. Have you updated AppToMarket to 4.1, if not do it….
          2. When you get this “ERROR: Unable to decompile” try by pressing the button “Update Manifest” and again press button “Decompile”.
          3. Delete 1.apk file in the C:UsersXXXXapktoolframework folder and try again to Decompile…

            • seghier khaled on September 4, 2016 at 1:46 pm
            • Reply

            with the v4.1 always i got message about internet connection or server
            for this reason i use v4
            i tried but always the same problem

            1. AppToMarket 4.0 won’t work with MIT latest built.

              Sorry, I’m not so good at updating the information, I’ve only updated information for this in Sidebar Tutorial. See Notes at that page…

            2. I used apktool from this page and it works without any issue on all App Inventor Distributions.

                • seghier khaled on September 4, 2016 at 3:11 pm
                • Reply

                thank you i will try again with apktool
                always i got manifest.xml like that
                http://i.imgbox.com/hO0iKeah.jpg
                i can’t edit anything

    • seghier khaled on September 4, 2016 at 4:59 pm
    • Reply

    i used advanced apk tool and i tried to do what you did
    the name of your theme : mytheme
    waht you change is : Mytheme
    the two name must the same : mytheme or Mytheme
    but after compiling i can’t open the application

    1. Files are named mytheme but you must specify in manifestfile Mytheme android:theme=”@style/Theme.Mytheme”

      after you build with apktool, you have to Sign, Verify and Zip align, otherwise your application will not work

      therefore the easiest and by far the best way to do this is with ApkModder However, it requires a donation
      the second is AppToMarket and finally apktool, because you will have to fill in things yourself and go through all those steps that ApkModder, AppToMarket automatically does

    • seghier khaled on September 4, 2016 at 6:29 pm
    • Reply

    yes i signed them and installed everytime in my phone but didn’t work
    something missing
    you can see here the xml file ; there is nothing about theme

      1. Take a look at my manifest file and the only thing you need to put into it,

        then copy the folders and files to respective location as I mention in this tutorial,
        now you can build your app, sign, verify and zipalign.

        If this doesn’t work for you then you are doing something wrong..

          • seghier khaled on September 5, 2016 at 6:51 pm
          • Reply

          thank you but didn’t work
          always : Unfortunately ….has stopped
          i donate apk modeler and i wait license to test it
          http://i.imgbox.com/c0bve36f.jpg

          • seghier khaled on September 6, 2016 at 11:14 am
          • Reply

          i tried with apkmodeler and the same problem

          1. You didn’t followed the tutorial

              • seghier khaled on September 7, 2016 at 7:04 am
              • Reply

              i did but you use older version
              i wait the response of the developer after he test the apk

              1. Not for Designer Properties

                  • seghier khaled on September 7, 2016 at 9:17 am
                  • Reply

                  i post a link of my app in the forum if you want test it
                  and it’s better if you make video tutorial with the new version and show step by step
                  thanks

                  1. as I said, Designer Properties look at the first picture in the tutorial.

                    Your app has not TitleVisible : Checked

                      • seghier khaled on September 7, 2016 at 12:18 pm

                      thank you ; finally work but with two problems
                      the fonts changed and are bigger and i got this message

                      runtime error
                      attemp to invoke virtual method
                      android.view.viewparent
                      android.view.view.getparent()
                      on a null object reference

    • Coco on November 13, 2016 at 5:14 am
    • Reply

    I’ve tried all steps multiple times.

    Whenever I try to run the app. It says it unexpectedly stops.

    Please help!

    1. Hi Coco,

      Without knowing how your app is built, I can only guess what might be wrong
      1. Designer Properties look at the first picture in the tutorial, you must have the TitleVisible:Checked and ShowStatusBar:Checked.
      2. Do you have Slider component in your project.

    • Coco on November 13, 2016 at 3:54 pm
    • Reply

    I do have them both checked. I also have a slider in the app.

    1. Slider component wont work with Holo or Material Theme because it is hard-coded by MIT AI2 however there is a solutions for this as well, easiest if you download this and use those files instead.

        • Coco on November 13, 2016 at 10:55 pm
        • Reply

        Copy those files to my temp_myDecompiles res folder?

        Will it work just like in MIT AI2? Colors supported?

          • Coco on November 13, 2016 at 11:07 pm
          • Reply

          Nevermind! It worked 😀

          Thanks so much.

          Please document this for other people to know

          1. Great that it worked for you.

            Yeah I know it was on my to do list.

    • diki on November 23, 2016 at 3:18 am
    • Reply

    hi Boban..
    can you help me…how to change package name with apptomarket…

    1. Unfortunately it is not possible with AppToMarket

    • Thomas on January 11, 2017 at 10:49 pm
    • Reply

    This is fantastic, thank you very much.

    Just wondering if it is possible to change the colour of the text and backgrounds for material.theme.
    Specifically
    -the background colour & text colour for listpicker title
    – the text colour for message dialogue title
    – the thumb colour for a slider

    1. I can look into this but no promises because it’s not easy to theme App Inventor apps.

      By the way, do you have something that I can see how it should look.

        • Thomas on January 13, 2017 at 1:55 am
        • Reply

        Thanks for getting back to me. Attached are images of the current state of the app with a description below of what I’d like to change. Thanks again, Thomas

        https://14973399418869302879.googlegroups.com/attach/5eab4e57ea084/image1.PNG?part=0.3&view=1&vt=ANaJVrEr3lNXZa3pTMRGPTKVYG7WP6A1QdLNs_G28dmO60jUFVKBfU2B5mDwrYOip30jeXMCB16DXvygO7drOgIbq7MHlUtT9XnPCRsBLCZceHKpX8t0MYs
        – Change the background colour from black to grey for the listpicker title
        – Change the text colour from blue to black for the listpicker title (i.e. Choose a mode)

        https://groups.google.com/group/mitappinventortest/attach/5eab4e57ea084/image2.PNG?part=0.2&authuser=0&view=1
        Image2.png – Change the text colour from blue to black for the message dialogue title (i.e. Default Preset)

        https://groups.google.com/group/mitappinventortest/attach/5eab4e57ea084/image3.PNG?part=0.1&authuser=0&view=1
        – Change the thumb colour slider from blue to black

        1. Thomas you mean you mimic the appearance of material theme for your app, because the thumb slider is from holo theme, dialog box image2 is also from holo theme and image1 is Hossein’s own dialog box from the old theme.

          The only way to have material theme is if your device support it by having Lollipop Android 5.0 or higher.

            • Thomas on January 13, 2017 at 11:24 am
            • Reply

            Thanks Bobans, I tried the app on my phone running nougat. Is this still holo theme or is it material?
            Ideally and if it is possible, I would still like to change the colour of thumb slider, background/text colour for the list picker heading and the text colour of the pink ‘ok’ button on the dialog box. Thanks again, Thomas

            https://drive.google.com/open?id=0B_YOAlGrpb6RZjBrbWZPTldGNm8
            https://drive.google.com/open?id=0B_YOAlGrpb6ReHo0SEZTcGYwa1k
            https://drive.google.com/open?id=0B_YOAlGrpb6RWVBBbUtmZV83UTg

            1. Now we’re talking, that’s material theme

              I will have to take a look at what needs to be changed, if possible to make it easier for me to see what needs to be changed can you share your app if not then can you save it as a copy in MIT, erase all block code except those that control other screens, dialog or that I need to see, then build your app.

              In your app do you use it in full screen, min and target SDK etc.

                • Thomas on January 14, 2017 at 12:17 am
                • Reply

                Awesome. I have just created another app and the colour issues are still there. Min sdk9 & Target sdk10.
                Thanks again, Thomas

                https://drive.google.com/open?id=0B_YOAlGrpb6RNFlhWWpQal9ZQ0E

                1. As I mentioned earlier, it is not easy to theme AI2 apps especially Notifier Dialogs in holo theme, material theme have other issues, depending on android version and phone brand, thereof it will not look the same.

                  This might work for Notifier Dialogs in holo theme, but there is much to change just to have another color for the title.

    • Shubham on October 10, 2017 at 3:51 am
    • Reply

    Hey , i followed above tutorial.
    But recompile was taking infinite time .

    So i used tickle my Android.
    Made those changes in manifest.
    Replaced the res folder.
    Installed the above framework. (1.apk)
    Recompiled with original signature.

    No changes in the android app when tested on marshmallow.

    Please help me with the issue.

    1. At the moment, I do not know why it behaves like that.
      Can you share your apk, so I can perform a test on it and see what’s happening.

      As for TMA, I do not have the necessary requirements to test with it Sorry.

    2. By the way, did you use this one runMeWindows_v41.bat to start the ATM…

    • Arnoud on August 2, 2018 at 4:13 pm
    • Reply

    Any change you will fix the material theme for the latest app-inventer version?

    Built: July 31 2018 Version: nb170
    Use Companion: 2.47

    before it worked pretty well and I liked it very much! It gave my apps a much more smoother look and feel!

    1. Sorry for late reply, since I haven’t been so active lately and I haven’t found a solution for it, Sorry..

      Btw, You know that you can use themes now so you don’t have to decompile apps anymore to have smoother looks.

      /Boban

  1. […] Resim İçin Teşekkürler […]

  2. […] Teşekkürler […]

Leave a Reply to pmesystem Cancel reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.