Android: Adding a change log dialog to your app

UPDATE 24-12-2012 – The code in this post is replaced by the open source library “Inscription” for more information:
Inscription library

In this post I’am going to share my code for a change log dialog.

Having a change log in your application gives the user the option to see what new features or bug fixes are done in your app history. It’s a good way to communicate your hard work done to create your app.

The change log dialog that I will be sharing parses a xml file and shows this as a nice styled html text. (See image attached to this post)
The styling is done with CSS code and can be adjusted to fit your app look. I Will explain this later in the post.

Import class

To use the change log in your app follow the following steps.
Download and unzip the following file and import the class in to your project.
ChangeLogDialog source code

String resources

The class needs a few resources, the first resources are string resources.
Just add these to your strings.xml file.
You might want to add translations to your project as well.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string name="title_changelog">Change log</string>
    <string name="changelog_close">Close</string>
</resources>

Change log XML file

The second resource you will need is a xml file with your change log.
This file should be in the following location of your project: “/res/xml/changelog.xml”
In this xml file you can use the following tags:

changelog This is the root tag.
release You can add a release tag for every version of your app.
The release tag needs to have two atributes:
version – This corresponds to the android:versionName attribute in your manifest file.
versioncode – This corresponds to the android:versionCode attribute in your manifest file.
change This tag is a child tag of the version tag. You can have as many change tags as needed. The change tag contains the actual text that will be displayed as a change in your change log dialog.

Here is a sample file:

<?xml version="1.0" encoding="utf-8"?>
<changelog>
	<release version="1.2" versioncode="3">
		<change>Fixed: A bug fix</change>
		<change>Button appearance changed</change>
		<change>Small layout change in the view item screen</change>
	</release>	
	<release version="1.1" versioncode="2">
		<change>Small layout change in the view item screen</change>
		<change>Minor tweaks</change>
	</release>	
</changelog>

Displaying the dialog

To invoke the change log dialog use the following code:

//Launch change log dialog
ChangeLogDialog _ChangelogDialog = new ChangeLogDialog(this); 
_ChangelogDialog.show();  

Customizing

Now you have your change log up and running.
If you want to change the look of the text within the dialog you can alter the following code in the ChangeLogDialog class. Just adjust the CSS code as needed.

//CSS style for the html
private String GetStyle() {
	return 
		"<style type=\"text/css\">"
		+ "h1 { margin-left: 0px; font-size: 12pt; }" 
		+ "li { margin-left: 0px; font-size: 9pt;}" 
		+ "ul { padding-left: 30px;}" 
		+ "</style>";
}
avatar

About Martin

Martin van Zuilekom has 12 years experience working as a professional software developer. Main focus points are user interface design and framework architecture. Follow Martin on Google plus

28 comments on “Android: Adding a change log dialog to your app

  1. Oh Martin,
    you are great! Thanks a lot for this useful library. Now I can replace my quick and dirty solution. :)

    Just one question: I want to write a short summary of the changes for each revision on the top of the li’s. Is it possible to “hack” this with styles easily.

    Greetings and recognition to your Code
    Felix

    • Sure it’s possible.

      You would just have to add an attribute to the release tag with a summary.
      Something like:

      <release version="1.4" versioncode="5" summary="This is my summary">
      

      And make sure to parse it in the changelog code in this function:

      	//Parse a the release tag and return html code
      	private String ParseReleaseTag(XmlResourceParser aXml) throws XmlPullParserException, IOException {
      		String _Result = "<h1>Release: " + aXml.getAttributeValue(null, "version") + "</h1><ul>";
              int eventType = aXml.getEventType();
              while ((eventType != XmlPullParser.END_TAG) || (aXml.getName().equals("change"))) {
              	if ((eventType == XmlPullParser.START_TAG) &&(aXml.getName().equals("change"))){
                  	eventType = aXml.next();
              		_Result = _Result + "<li>" + aXml.getText() + "</li>";
                  }
              	eventType = aXml.next();
              }		
              _Result = _Result + "</ul>";
              return _Result;
      	}
      

      This change should do the trick:

      String _Result = "<h1>Release: " + aXml.getAttributeValue(null, "version") + "</h1><br/>" + aXml.getAttributeValue(null, "summary") + "<ul>";
      

      Note I did not test this code. But it should be clear what changes need to be made to get it working.

  2. Hi Martin,

    Thanks for your very nice class.

    Do you have an idea about how to display the changelog only the first time the user launch the app, and not each time ? (may be in adding a boolean in settings ?)

    • If correct you should be able to put a translated xml file in a separate folder like so:
      xml (this is the default language folder, most likely English)
      xml-de (this is your translation folder, in this case German)

      The change log should get the correct translation according to the language set in the Android system.

  3. Hello Martin,
    Please add the code to run changelog only when first run app and after the release of code in AndroidManifest.xml

    Thanks you.

    • Hi Alex,

      This code has been replaced by the Inscription library.
      You can get the dev branch from Github, in there you will find a what’s new dialog that shows the latest changes at start up.

  4. Hi Martin! First of all i wanna say, Great tutorial! I am new to Android development and sometimes it can be hard to understand some other tutorials. I have used your “change log dialog” in my latest app that am working on. You can check it out at (http://bit.ly/qpinner) . Thanks!!!

    • Thank you.

      I Would recommend to use the new Inscription library if you are not yet using it. It contains the same change log dialog but has improved code.

      Good luck with your app. :)

  5. Good Idea man, but trying Inscription library in my app I’ve noticed that it’s too slow to check if it’s the first boot (or if the app has been updated) and in case show the Whatsnew/Changelog message.

    • The check should be almost instantaneous. It’s just a simple check on the shared preferences. Maybe the rendering of the dialog itself is causing delay?
      Does the check delay your startup or does the dialog not show at all? I’m wondering what the exact problem is you are dealing with.

  6. hi,Martin
    I’m Chinese
    Thanks your ChangeLogDialog,but it can show Chinese.
    So, I modify the source code:
    //Create webview and load html
    WebView _WebView = new WebView(fActivity);
    _WebView.getSettings().setDefaultTextEncodingName(“utf-8″);
    _WebView.loadDataWithBaseURL(“”,_HTML, “text/html”, “utf-8″,””);

    then,it works.

  7. hey dud this is an awesome tuts. but i had an error with
    ChangeLogDialog _ChangelogDialog = new ChangeLogDialog(this);
    _ChangelogDialog.show();
    there is changeLogDilog file in java which given by you but i still get error. help me resolve this

    thanks
    medy

    • Hi Medy,

      The best thing to do is use the Inscription library. It has example projects that you can import into Eclipse and see how to call the dialog. The code in this article is outdated and is replaced by the Inscription library. Please open the link “Inscription” on the main menu on the top of this website, there you will find a link to the project on Github.

  8. Hi Martin!

    Thanks for this great little piece of code. I’ve been using this for the last few months in my app, and it’s worked a treat. I’m glad I came across this site again, as I see you have a new library, thanks once once again! :)

    I wanted to ask, though, is there a way to have a clickable link in the changelog?

    • Thank you for you kind words :)

      Adding links to the change log is not possible at the moment. If you want you can fork the dev branch from the dev tree on GitHub and add the logic, once done you can make a pull request to merge your changes into the official library.

      The function you are interested in is the parseReleaseTag function in the ChangeLogDialog class.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>