{"id":26,"date":"2018-05-27T17:34:20","date_gmt":"2018-05-27T17:34:20","guid":{"rendered":"https:\/\/blogs.scummvm.org\/douglas\/?p=26"},"modified":"2022-05-24T17:56:27","modified_gmt":"2022-05-24T17:56:27","slug":"residualvm-week-2","status":"publish","type":"post","link":"https:\/\/blogs.scummvm.org\/douglas\/2018\/05\/27\/residualvm-week-2\/","title":{"rendered":"ResidualVM: Week 2"},"content":{"rendered":"<div class=\"post-outer\">\n<div class=\"post\">\n<div id=\"post-body-1517659436735224853\" class=\"post-body entry-content float-container\">\n<div>This week&#8217;s main focus is on the settings menu, the menu that I deemed the most complex one before. Well, it is indeed complex, but the overall development process was again better than my expectation. Wish I can keep this good start along the way&#8230;<\/div>\n<div><\/div>\n<div>So, the settings menu. The first things to do is, of course, to get all the widgets rendered on the screen. The basic part is identical to how the main menu and the diary index menu are implemented. Dump the game data, load them with class\u00a0StaticLocationWidget, and they are in position.\u00a0 But the settings menu have some other bothersome things. It contains two special widgets: checkboxes and sliders. These two widgets are not stored in the place where\u00a0StaticLocationWidget\u00a0reads resources and they behave differently.<\/div>\n<div><\/div>\n<div>\n<table class=\"tr-caption-container\" cellspacing=\"0\" cellpadding=\"0\" align=\"center\">\n<tbody>\n<tr>\n<td><img decoding=\"async\" src=\"https:\/\/blogs.scummvm.org\/douglas\/wp-content\/uploads\/sites\/63\/2022\/05\/SettingsMenu.png\" \/><\/td>\n<\/tr>\n<tr>\n<td class=\"tr-caption\">The settings menu, see the checkboxes and sliders?<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>One natural idea is to reconstruct the class\u00a0StaticLocationWidget, making it a more general base class to handle all situations. But that would be a large task, and somehow unrealistic. The base class of any menu, the\u00a0StaticLocationScreen\u00a0class, heavily based on the API of\u00a0StaticLocationWidget. If the mechanism of\u00a0StaticLocationWidget\u00a0is changed greatly, a whole bunch of codes need to be modified.<\/div>\n<div><\/div>\n<div>So after thinking, plus noticing the fact that each checkbox or slider is accompanied by a text, which is loaded through\u00a0StaticLocationWidget, I decided to further extend the class\u00a0StaticLocationWidget, wrapping the checkbox and the slider and bind them with the corresponding texts. The class\u00a0StaticLocationWidget\u00a0still needs to be modified to allow virtual calls, but the change in the overall architecture is at its minimum.<\/div>\n<div>\n<p>\u200b<\/p>\n<table class=\"tr-caption-container\" cellspacing=\"0\" cellpadding=\"0\" align=\"center\">\n<tbody>\n<tr>\n<td><img decoding=\"async\" src=\"https:\/\/blogs.scummvm.org\/douglas\/wp-content\/uploads\/sites\/63\/2022\/05\/CheckboxSlider.png\" \/><\/td>\n<\/tr>\n<tr>\n<td class=\"tr-caption\">Checkbox and Slider<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>Additionally, the slider&#8217;s behaviour needs to be handled specifically. Firstly, it supports an action that no other elements in the game support: being dragged by the mouse. This is achieved through handling the &#8220;mouse down&#8221; and &#8220;mouse up&#8221; event. Secondly, when the slider is dragged, it will play a sound in a loop but when it is released, the sound will not stop instantly, but plays its last round. This is handled by an additional class called SoundManager, specifically designed for the slider.<\/div>\n<div>\n<p>\u200b<\/p>\n<table class=\"tr-caption-container\" cellspacing=\"0\" cellpadding=\"0\" align=\"center\">\n<tbody>\n<tr>\n<td><img decoding=\"async\" src=\"https:\/\/blogs.scummvm.org\/douglas\/wp-content\/uploads\/sites\/63\/2022\/05\/SoundManager.png\" \/><\/td>\n<\/tr>\n<tr>\n<td class=\"tr-caption\">The\u00a0SoundManager<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>After all the widgets are properly rendered, it is time to actually enable those settings. Since game&#8217;s\u00a0setting\u00a0data may need to be globally accessed throughout the game, I utilized the\u00a0Services\u00a0class and created a new service simply called\u00a0Settings. It is its responsibility to record all the settings value, synchronize them with ResidualVM, and provide globally accessible interfaces for related entities to query settings.<\/div>\n<div>\n<table class=\"tr-caption-container\" cellspacing=\"0\" cellpadding=\"0\" align=\"center\">\n<tbody>\n<tr>\n<td><img decoding=\"async\" src=\"https:\/\/blogs.scummvm.org\/douglas\/wp-content\/uploads\/sites\/63\/2022\/05\/Settings-1.png\" \/><\/td>\n<\/tr>\n<tr>\n<td class=\"tr-caption\">The\u00a0Settings\u00a0service<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<div>And that is the basis of how the settings menu works. Next week I plan to focus on the save &amp; load menu. Hope everything goes well \ud83d\ude00<\/div>\n<div><\/div>\n<div>\n<div>\n<div>For the detailed development of the codes, please refers to\u00a0<a href=\"https:\/\/github.com\/residualvm\/residualvm\/pull\/1417\" target=\"_blank\" rel=\"noopener\">the pull request on GitHub<\/a>.<\/div>\n<\/div>\n<div>\n<div>\n<div>All code images are generated through\u00a0<a href=\"https:\/\/carbon.now.sh\/\" target=\"_blank\" rel=\"noopener\">Carbon<\/a>.<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"post-bottom\">\n<div class=\"post-footer float-container\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<section id=\"comments\" class=\"comments threaded\" data-embed=\"true\" data-num-comments=\"2\"><\/section>\n","protected":false},"excerpt":{"rendered":"<p>This week&#8217;s main focus is on the settings menu, the menu that I deemed the most complex one before. Well, it is indeed complex, but the overall development process was again better than my expectation. Wish I can keep this good start along the way&#8230; So, the settings menu. The first things to do is, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-26","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/posts\/26","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/comments?post=26"}],"version-history":[{"count":2,"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/posts\/26\/revisions"}],"predecessor-version":[{"id":74,"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/posts\/26\/revisions\/74"}],"wp:attachment":[{"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/media?parent=26"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/categories?post=26"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blogs.scummvm.org\/douglas\/wp-json\/wp\/v2\/tags?post=26"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}