{"id":104,"date":"2015-04-30T20:56:40","date_gmt":"2015-04-30T20:56:40","guid":{"rendered":"http:\/\/visualgdb.com\/w\/?p=104"},"modified":"2015-04-30T20:56:40","modified_gmt":"2015-04-30T20:56:40","slug":"android-vs-android-codemap","status":"publish","type":"post","link":"https:\/\/visualgdb.com\/tutorials\/android\/vs-android\/codemap\/","title":{"rendered":"Using Code Map to understand C++ Android code"},"content":{"rendered":"\n<p>This tutorial shows how to use the CodeMap feature of Visual Studio to understand the structure of complex C++ code. We will show it based on the san-angeles demo built using vs-android, however it will also work for all other VisualGDB project types.<\/p>\n<ol>\n<li>Install <a href=\"\/download\"> VisualGDB<\/a> 5.0 or later (ensure that &#8220;Android Edition&#8221; is checked in the installer). This will add support for debugging and Clang-based IntelliSense to vs-android projects.<\/li>\n<li>Ensure you can build and debug the san-angeles project by following <a href=\"http:\/\/visualgdb.com\/tutorials\/android\/vs-android\/codemap\/..\/\">this tutorial<\/a>. <\/li>\n<li>Open the san-angeles project and go to the <strong> drawModels <\/strong>function in <strong>demo.c<\/strong>:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/01-drawmodels.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-1\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/01-drawmodels.png\" alt=\"01-drawmodels\" width=\"699\" height=\"641\" \/><\/a><\/li>\n<li>The first thing we will investigate using code map is that <strong>drawModels()<\/strong> function that appears to be called repeatedly is calling <strong>seedRandom()<\/strong> each time with the same value. That supposedly resets the state of the random number generator. Let&#8217;s use the code map to understand what is affected by this. Right-click on <strong>seedRandom()<\/strong> and select &#8220;show on code map&#8221;:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/02-map.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-2\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/02-map.png\" alt=\"02-map\" width=\"699\" height=\"642\" \/><\/a><\/li>\n<li>A new Code Map window will appear. Right-click on seedRandom in that window and select &#8220;show referenced data&#8221;:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/03-data.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-3\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/03-data.png\" alt=\"03-data\" width=\"699\" height=\"640\" \/><\/a><\/li>\n<li>You will see that seedRandom accesses the sRandomSeed variable. Right-click on it and select &#8220;Show functions referencing this&#8221;:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/04-randomseed.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-4\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/04-randomseed.png\" alt=\"04-randomseed\" width=\"699\" height=\"642\" \/><\/a><\/li>\n<li>Now you will see that sRandomSeed is also accessed by <strong>randomUInt()<\/strong>:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/05-2calls.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-5\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/05-2calls.png\" alt=\"05-2calls\" width=\"699\" height=\"642\" \/><\/a><\/li>\n<li>Now we need to figure out the context in which both functions are called. Select both of them by holding the ctrl key, right-click and select &#8220;Show functions calling this&#8221;: <a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/06-callers.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-6\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/06-callers.png\" alt=\"06-callers\" width=\"699\" height=\"644\" \/><\/a><\/li>\n<li>Now you will see all functions in the project that call the two random number functions we found. However, this is not enough to see the big picture:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/07-4callers.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-7\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/07-4callers.png\" alt=\"07-4callers\" width=\"699\" height=\"643\" \/><\/a><\/li>\n<li>Repeat the previous step (selecting newly found functions) twice more until you see the functions called by the Java framework (starting with <strong>Java_<\/strong>):<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/08-jnifuncs.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-8\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/08-jnifuncs.png\" alt=\"08-jnifuncs\" width=\"699\" height=\"641\" \/><\/a>Now the big picture is clear: the random functions are mainly involved during app initialization and the only other place that calls them is the <strong>drawModels()<\/strong> function itself. Hence, resetting the random seed inside <strong>drawModels()<\/strong> does not affect the behavior of other functions.<\/li>\n<li>Now let&#8217;s use Code Map to quickly find functions related to the GLObject struct. First of all, select any of the GLObject&#8217;s fields and select &#8220;Show on Code Map&#8221;:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/09-globject.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-9\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/09-globject.png\" alt=\"09-globject\" width=\"699\" height=\"643\" \/><\/a><\/li>\n<li>Then right-click on it and select &#8220;Show containing type&#8221;:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/10-showtype.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-10\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/10-showtype.png\" alt=\"10-showtype\" width=\"699\" height=\"640\" \/><\/a><\/li>\n<li>Right-click on the type, select &#8220;Show type contents&#8221;, then select all fields, right-click select &#8220;Show functions referencing this&#8221;:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/11-showrefs.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-11\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/11-showrefs.png\" alt=\"11-showrefs\" width=\"699\" height=\"644\" \/><\/a><\/li>\n<li>You will now see all functions that directly reference fields of GLObject:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/12-objectfuncs.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-12\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/12-objectfuncs.png\" alt=\"12-objectfuncs\" width=\"699\" height=\"642\" \/><\/a><\/li>\n<li>By highlighting all objects and repeatedly selecting &#8220;Show functions calling this&#8221; you can easily see the big picture:<a href=\"http:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/13-objlifetime.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-13\" src=\"https:\/\/visualgdb.com\/w\/wp-content\/uploads\/tutorials\/android\/vs-android\/codemap\/13-objlifetime.png\" alt=\"13-objlifetime\" width=\"699\" height=\"643\" \/><\/a>The Code Map now clearly shows how the objects are created during initialization, used during the render calls and destroyed during the de-initialization. You can double-click on any of the functions or fields to quickly jump to the code and examine the function contents.<\/li>\n<\/ol>\n<p><\/root><\/p>\n","protected":false},"excerpt":{"rendered":"<p>This tutorial shows how to use the CodeMap feature of Visual Studio to understand the structure of complex C++ code.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[11],"tags":[31,51,48],"_links":{"self":[{"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/posts\/104"}],"collection":[{"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/comments?post=104"}],"version-history":[{"count":0,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/posts\/104\/revisions"}],"wp:attachment":[{"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/media?parent=104"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/categories?post=104"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/visualgdb.com\/w\/wp-json\/wp\/v2\/tags?post=104"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}