Filter
-
Content Type
-
Category
Mobile/Wearable
Visual Display
Digital Appliance
Platform
Recommendations
Filter
Learn Code Lab
codelabapply conditional lines on watch faces objective learn how to create a watch face that responds to time and notification using conditional lines in watch face studio overview watch face studio is a graphic authoring tool that enables you to create and design watch faces for watches running on wear os it offers a simple and intuitive way to add images and components, and to configure the watch movement without any coding watch face studio supports watch faces for the galaxy watch4 or newer version, and other watch devices that run on the same platform conditional lines in watch face studio lets users easily control components and its behaviors on watch faces you can make your watch faces change dynamically based on time, step-count, or battery using conditional lines now, with the latest version of watch face studio, you can also set conditional lines based from events such as low battery, unread notification, or scenarios without any events set up your environment you will need the following watch face studio latest version galaxy watch4 or newer any supported wear os watch sample project here is a sample project for this code lab download it and start your learning experience! conditional lines sample project 2 43 mb start your project download the sample project file, and click open project in watch face studio locate the downloaded file, then click open apply conditional lines based on time using conditional lines in watch face studio, your watch face can visually change its design based on the time of the day here, you can change the background image of the watch face based on certain time intervals by setting the timeline condition of two background images, named background_day and background_night click the show/hide timeline icon to show the frame area notice that there's a default conditional line based on time for every component each conditional line is represented by a bar in the timeline and you can adjust it using the slider at the end of the bar collapse the background group containing the two background images in the timeline area of background_day, click on its bar and hover your mouse at the start of the bar drag the start of the bar to 06 00 00h and drag the end of the bar to 18 00 00h this sets the condition that background_day visually appears on the watch face from 6 00 am until 6 00 pm tipto quickly navigate on the timeline, hold shift + mouse scroll learn more about keyboard shortcuts, by referring to this guide next, for background_night, set the first time condition from 00 00 00h to 06 00 00h by dragging its bar respectively at the start of 18 00 00h, double-click at the timeline area to create a 2nd bar at that specific time drag the end of the bar to 00 00 00h, at the rightmost part of the timeline this makes background_night to appear conditionally from 6 00 pm until 6 00am on your watch face now, it's time to check if your watch face responds correctly based on the time of the day click show/hide run button to open the run panel in watch face studio move the time control slider from 06 00 00h to 18 00 00h and the watch face should show background_day as its background similarly, check if the watch face changes its background to background_night when the time is from 18 00 00h to 06 00 00h set the unread notification event make your watch face change dynamically based on a specific device event in this step, add an event for unread notifications on notification_envelope, an animation component included in the sample project click + or add conditional line and select event noteto remove conditional line icons such as the battery, steps, 12h/ 24h, or event, simply right-click on it and select remove click show/hide event to start configuring the event-based conditional line for notification_envelope on the notification_envelope layer, double-click on the event frame in the warning window, click ok in this case, all existing conditional frames for this layer are deleted afterward, a bar is created for the event-based conditional line noteeach layer responds to only one type of condition next, drag the bar from no event to unread notification noteno event is used if there is no condition set on either battery low or unread notification events check if the notification_envelope animation component appears on your watch face whenever there's an unread notification click play run preview and move the unread notification slider in the run panel when the unread notification is set to a value of 1 or more, the animation component should visually appear on your watch face test the watch face to test your watch face, you need to connect a watch device to the same network as your computer in watch face studio, select run on device select the connected watch device you want to test with if your device is not detected automatically, click scan devices to detect your device or enter its ip address manually by clicking the + button notethe always-on display is already set in the project to run the watch face successfully, you may need to configure its always-on display to avoid any error when you run on device you're done! congratulations! you have successfully achieved the goal of this code lab now, you can use conditional lines in watch face studio, all by yourself! if you're having trouble, you may download this file conditional lines complete project 2 43 mb to learn more about watch face studio, visit developer samsung com/watch-face-studio
Learn Code Lab
codelabtest edge drivers using smartthings test suite objective learn how to identify and resolve issues when deploying edge drivers using smartthings test suite overview smartthings test suite is a tool for testing iot device integrations within the smartthings platform this solution provides a seamless certification process, allowing developers of smartthings hub connected devices to submit their products for certification without the need for manual testing this accelerates the certification timeline and offers a more cost-effective path to certifying these devices the key feature of this self-testing tool is it contains an automated testing suite that covers critical certification criteria, ranging from functionality to performance tests the tool also provides real-time feedback that gives detailed information on the device's compliance status, allowing for quick identification and resolution of any issues lastly, it has an intuitive and user-friendly interface that ensures a seamless experience for developers of all levels set up your environment you will need the following host pc running on windows 10 or higher or ubuntu 20 04 x64 visual studio code latest version recommended devices connected on the same network android mobile device with smartthings app installed with android 10 or higher smartthings station or smartthings hub onboarded with samsung account smartthings v4 multipurpose sensor or lightify tunable white 60 light bulb notemake sure that your devices are connected to your smartthings app sample code here is a sample code for this code lab download it and start your learning experience! test suite sample code 185 4 kb install smartthings cli you need to install smartthings cli as this is the main tool for developing apps and drivers for smartthings edge drivers to install smartthings cli, open a web browser and download the smartthings msi installer from the latest release notefor other operating systems, download the appropriate zipped binary and install it on your system path open the smartthings cli setup in the downloaded file, then click next accept the license agreement terms, then click next select the destination path for installation and click next to begin the installation process, click install notethe windows installer may display a warning titled windows protected your pc to continue the installation, click more info > run anyway complete the setup by clicking finish to verify if smartthings cli is installed correctly, open the command prompt and run this command smartthings --version view and run available commands for smartthings cli with this command smartthings --help for a full list of commands, visit the smartthings cli commands notethe smartthings cli supports an automatic login flow that launches a browser window, prompting the user to log in with samsung account and grant the cli permissions to access the user's account start your project after downloading and extracting the sample code containing the project files, click file > open folder in visual studio code to open it locate the sample code file directory and click select folder once finished, the project files are seen on the explorer menu configure custom edge drivers open your command prompt or terminal and follow the corresponding instructions depending on your device availability make sure that the path directory in your cli contains the project file smartthings multipurpose sensor in the terminal, type the following command to build and upload your edge driver package to the smartthings cloud smartthings edge drivers package drivers/codelab-zigbee-contact create a new channel for your edge driver and enter the following channel details smartthings edge channels create channel name smartthings test suite demo channel description channel for sdc2024 channel terms of service url www smartthings com enroll your hub in your newly created channel and select the corresponding channel and hub smartthings edge channels enroll assign your driver to the created channel smartthings edge channels assign install the created edge driver from your channel to your own hub smartthings edge drivers install confirm that the correct version of the driver is present in your hub smartthings edge drivers installed select the edge driver for this device smartthings edge drivers switch lightify tunable white 60 bulb in the terminal, type the following command to build and upload your edge driver package to the smartthings cloud smartthings edge drivers package drivers/codelab-zigbee-switch create a new channel for your edge driver and enter the following channel details smartthings edge channels create channel name smartthings test suite demo channel description channel for sdc2024 channel terms of service url www smartthings com enroll your hub in your newly created channel and select the corresponding channel and hub smartthings edge channels enroll assign your driver to the created channel smartthings edge channels assign install the created edge driver from your channel to your own hub smartthings edge drivers install confirm that the correct version of the driver is present in your hub smartthings edge drivers installed select the edge driver for this device smartthings edge drivers switch test your device on your web browser, go to smartthings test suite, login to your samsung account and follow the corresponding instructions depending on your device availability smartthings multipurpose sensor on the test suite, look for your device, click menu icon > prepare new test under the compatible capabilities, select all capabilities except for battery, and click start during the test execution, perform the indicated user actions for every test case if there are any it might cause incorrect test results if user actions are not performed tipyou may view the real-time sensor states of the device in the smartthings mobile app view the test summary after the test it returns a failed test that you are going to resolve in the next step lightify tunable 60 white bulb on the test suite, look for your device, click menu icon > prepare new test under the compatible capabilities, select all capabilities after you've selected the capabilities, click start warningduring the test execution, observe the behavior of the bulb it might cause incorrect test results if automated tests are interrupted view the test summary after the test it returns a failed test that you are going to resolve in the next step resolve test failures smartthings multipurpose sensor the test logs contain basic information about the test results and specific test cases, providing technical context to users for efficient troubleshooting download the test logs by navigating to the bottom page of the test summary > show full test details > download log to understand the test logs, its structure follows this schema {execution timestamp} device node path node type [node state] {execution message} in the downloaded test log, two test cases failed with the following error [failed] initialize states following states were not set correctly [contact any other state than "open" on main contactsensor] [failed] send command and validate some events didn't happen [contact "closed" on main contactsensor] some states aren't final [contact "closed" on main contactsensor] in the first error log, it appears that the test suite cannot change the device's state to anything other than an open state in the second error log, the test suite tries to change its state to closed, but to no avail it is confirmed in the capability definition that the contact sensor has only two states open and closed therefore, the device is constantly in an open state and unable to change to a closed state with these information, you can start troubleshooting by going to drivers > codelab-zigbee-contact > multi-sensor > init lua and look for incorrect code implementation with these keywords open, closed, contactsensor it can be seen in the zone_status_change_handler and zone_status_handler functions that there are code blocks on comment this might be a result of someone developing this code have changed this part of code for debugging and forgot to uncomment this part uncomment this code block from zone_status_change_handler function if not device preferences["certifiedpreferences garagesensor"] then contactsensor_defaults ias_zone_status_change_handler driver, device, zb_rx end uncomment this code block from zone_status_handler function if not device preferences["certifiedpreferences garagesensor"] then contactsensor_defaults ias_zone_status_attr_handler driver, device, zone_status, zb_rx end remove this line of code from zone_status_change_handler and zone_status_handler functions device emit_event_for_endpoint zb_rx address_header src_endpoint_value, capabilities contactsensor contact open save the file and update the driver by invoking the same cli commands that were also used during the configuration of custom edge drivers smartthings edge drivers package drivers/codelab-zigbee-contact smartthings edge channels assign smartthings edge drivers install again, go to smartthings test suite, select your device, click menu > prepare new test ensure that all compatible capabilities are selected, with the exception for battery again, start the test and perform indicated user actions for every test case if there are any now, all tests are passed! lightify tunable white 60 bulb the test logs contain basic information about the test results and specific test cases, providing technical context to users for efficient troubleshooting download the test logs by navigating to the bottom page of the test summary > show full test details > download log to understand the test logs, its structure follows this schema {execution timestamp} device node path node type [node state] {execution message} in the downloaded test log, one test case failed with the following error [failed] send command and validate some events didn't happen [colortemperature maximum 7500k on main colortemperature] some states aren't final [colortemperature maximum 7500k on main colortemperature] in the error log, it directs to an issue for setting an incorrect maximum colortemperature value the configuration on your edge driver is set to 7500k you can start to troubleshoot by looking for the bulb's color temperature rating either from the device packaging or the device manufacturer website with these information, you can start troubleshooting by going to drivers > codelab-zigbee-switch > profiles > rgbw-bulb yml and look for lines that declares the colortemperature value change the colortemperature range declaration range [ 2700, 6500 ] save the file and update the driver by invoking the same cli commands that were also used during the configuration of custom edge drivers smartthings edge drivers package drivers/codelab-zigbee-switch smartthings edge channels assign smartthings edge drivers install again, go to smartthings test suite, select your device, click menu > prepare new test under the compatible capabilities, select all capabilities again, start the test and perform indicated user actions for every test case if there are any now, all tests are passed! you're done! congratulations! you have successfully achieved the goal of this code lab now, you can test your edge driver for smartthings devices using smartthings test suite! if you're having trouble, you may download this file test suite complete code 184 6 kb to learn more about smartthings test suite, visit smartthings edge architecture smartthings developer console
Learn Code Lab
codelabimplement flex mode on an unreal engine game objective learn how to implement flex mode on an unreal engine game using android jetpack windowmanager and raw java native interface jni overview the flexible hinge and glass display on galaxy foldable devices, such as the galaxy z fold4 and galaxy z flip4, let the phone remains propped open while you use apps when the phone is partially folded, it will go into flex mode apps will reorient to fit the screen, letting you watch videos or play games without holding the phone for example, you can set the device on a flat surface, like on a table, and use the bottom half of the screen to navigate unfold the phone to use the apps in full screen mode, and partially fold it again to return to flex mode to provide users with a convenient and versatile foldable experience, developers need to optimize their apps to meet the flex mode standard set up your environment you will need the following epic games launcher with unreal engine 4 or later visual studio or any source code editor samsung galaxy foldable device galaxy z fold2, z fold3, or newer galaxy z flip, z flip3, or newer remote test lab if physical device is not available requirements samsung account java runtime environment jre 7 or later with java web start internet environment where port 2600 is available create and set up your project after launching unreal engine from the epic games launcher, follow the steps below to start your project in the select or create new project window, choose games as a new project category and click next select third person as template, then click next to proceed noteyou can implement flex mode on any template or existing projects and use this code lab activity as a reference in the project settings window, set the following type of project c++ target platform mobile / tablet performance characteristics scalable 3d or 2d real-time raytracing raytracing disabled include an additional content pack no starter content project name tutorial_project click create project wait for the engine to finish loading and open the unreal editor once the project is loaded, go to edit > project settings > platforms > android click the configure now button if the project is not yet configured for the android platform then, proceed with the following apk packaging and build settings a apk packaging set target sdk version to 30 set orientation to full sensor change the maximum supported aspect ratio to 2 8 aspect ratio of galaxy z fold3 in decimal to prevent black bars from appearing on the cover display leave it if your game does not need to use the cover display enable use display cutout region?, to prevents black bars at the edge of the main screen otherwise, leave it unchecked b build disable support opengl es3 1 and enable support vulkan notecurrently, there is a problem with opengl es and the split-screen system being investigated the only option right now is to turn off opengl es and use vulkan instead enable native resize event the resize event of a game when switching between displays is disabled in the engine by default however, this behavior can be easily enabled by setting android enablenativeresizeevent=1 in the deviceprofile currently, the only way to create a profile for foldable devices is by creating a specific rule for each device to save time in this code lab, enable the native resize event for all android devices instead locate and open the tutorial_project > config folder in file explorer inside the config folder, create a new folder named android create a new file called androiddeviceprofiles ini and open this file in a text editor, such as visual studio copy below deviceprofile code to the newly created androiddeviceprofiles ini file [deviceprofiles] +deviceprofilenameandtypes=android,android [android deviceprofile] devicetype=android baseprofilename= +cvars=r mobilecontentscalefactor=1 0 +cvars=slate absoluteindices=1 +cvars=r vulkan delayacquirebackbuffer=2 +cvars=r vulkan robustbufferaccess=1 +cvars=r vulkan descriptorsetlayoutmode=2 ; don't enable vulkan by default specific device profiles can set this cvar to 0 to enable vulkan +cvars=r android disablevulkansupport=1 +cvars=r android disablevulkansm5support=1 ; pf_b8g8r8a8 +cvars=r defaultbackbufferpixelformat=0 +cvars=android enablenativeresizeevent=1 ; previewallowlistcvars and previewdenylistcvars are arrays of cvars that are included or excluded from being applied in mobile preview ; if any previewallowlistcvars is set, cvars are denied by default previewallowlistcvars=none this is a copy of the default android deviceprofile from the existing basedeviceprofiles ini file but with the enabled nativeresizeevent console variable cvars notethis step is not required when you only want to implement flex mode yet, it's recommended, to allow applications to run seamlessly from main to cover display without stretching and squashing the game, by enabling the nativeresizeevent create a new plugin and import the foldablehelper foldablehelper is a java file that you can use in different projects it provides an interface to the android jetpack windowmanager library, enabling application developers to support new device form factors and multi-window environments before proceeding, read how to use jetpack windowmanager in android game dev and learn the details of how foldablehelper uses windowmanager library to retrieve information about the folded state of the device flat for normal mode and half-opened for flex mode , window size, and orientation of the fold on the screen download the foldablehelper java file here foldablehelper java 5 64 kb to import the foldablehelper java file to the project, follow the steps below go to edit > plugins in the unreal editor click the new plugin button and select blank to create a blank plugin in the name field, type foldables_tutorial and click the create plugin button in file explorer, locate and open tutorial_project > plugins folder go to plugins > foldables_tutorial > source> foldables_tutorial > private and create a new folder called java copy the foldablehelper java file into java folder open the tutorial_project sln file in visual studio in the same private folder path, add a new filter called java right-click on the java filter and click add > existing item locate the foldablehelper java file, then click add to include this java file in the build modify java activity to use foldablehelper unreal plugin language upl is a simple xml-based language created by epic games for manipulating xml and returning strings using upl, you can utilize the foldablehelper java file by modifying the java activity and related gradle files as follows in visual studio, right-click on source > foldables_tutorial folder, then click add > new item > web > xml file xml create an xml file called foldables_tutorial_upl xml ensure that the file location is correct before clicking add in the newly created xml file, include the foldablehelper java file in the build by copying the java folder to the build directory <root xmlns android="http //schemas android com/apk/res/android"> <prebuildcopies> <copydir src="$s plugindir /private/java" dst="$s builddir /src/com/samsung/android/gamedev/foldable" /> </prebuildcopies> set up the gradle dependencies in the build gradle file by adding the following in the xml file <buildgradleadditions> <insert> dependencies { implementation filetree dir 'libs', include ['* jar'] implementation "org jetbrains kotlin kotlin-stdlib-jdk8 1 6 0" implementation "androidx core core 1 7 0" implementation "androidx core core-ktx 1 7 0" implementation "androidx appcompat appcompat 1 4 0" implementation "androidx window window 1 0 0" implementation "androidx window window-java 1 0 0" } android{ compileoptions{ sourcecompatibility javaversion version_1_8 targetcompatibility javaversion version_1_8 } } </insert> </buildgradleadditions> next, modify the gameactivity <gameactivityimportadditions> <insert> <!-- package name of foldablehelper --> import com samsung android gamedev foldable foldablehelper; </insert> </gameactivityimportadditions> <gameactivityoncreateadditions> <insert> foldablehelper init this ; </insert> </gameactivityoncreateadditions> <gameactivityonstartadditions> <insert> foldablehelper start this ; </insert> </gameactivityonstartadditions> <gameactivityonstopadditions> <insert> foldablehelper stop ; </insert> </gameactivityonstopadditions> </root> gameactivityimportadditions adds the com samsung android gamedev foldable foldablehelper into the gameactivity with the existing imports gameactivityoncreateadditions adds the code to the oncreate method inside the gameactivity gameactivityonstartadditions adds the code to the onstart method inside the gameactivity gameactivityonstopadditions adds the code to the onstop method inside the gameactivity save the xml file then, ensure that the engine uses the upl file by modifying the foldables_tutorial build cs script, located in the same folder as the foldables_tutorial_upl xml file after the dynamicallyloadedmodulenames addrange call, add the following if target platform == unrealtargetplatform android { additionalpropertiesforreceipt add "androidplugin", moduledirectory + "\\foldables_tutorial_upl xml" ; } this means that the game engine will use the upl file if the platform is android otherwise, the foldablehelper won’t work implement a storage struct the next thing to implement is a struct, the native version of java’s foldablelayoutinfo class to store the data retrieved from the java code using a struct, do the following in content browser of unreal editor, right-click on c++ classes > add/import content then, click new c++ class select none for the parent class and click next name the new class as foldablelayoutinfo assign it to the foldables_tutorial plugin then, click create class delete the created foldablelayoutinfo cpp file and only keep its header file in the header file called foldablelayoutinfo h, set up a struct to store all needed data from the windowmanager #pragma once #include "core h" enum efoldstate { undefined_state, flat, half_opened }; enum efoldorientation { undefined_orientation, horizontal, vertical }; enum efoldocclusiontype { undefined_occlusion, none, full }; struct ffoldablelayoutinfo { efoldstate state; efoldorientation orientation; efoldocclusiontype occlusiontype; fvector4 foldbounds; fvector4 currentmetrics; fvector4 maxmetrics; bool isseparating; ffoldablelayoutinfo state efoldstate undefined_state , orientation efoldorientation undefined_orientation , occlusiontype efoldocclusiontype undefined_occlusion , foldbounds -1, -1, -1, -1 , currentmetrics -1, -1, -1, -1 , maxmetrics -1, -1, -1, -1 , isseparating false { } }; implement jni code to implement jni, create a new c++ class with no parent and name it foldables_helper assign the class to the same plugin, then modify the c++ header and source files as follows in the created header file foldables_helper h , include foldablelayoutinfo h #include "foldablelayoutinfo h" then, declare a multicast_delegate to serve as a listener for passing the data from the java implementation to the rest of the engine declare_multicast_delegate_oneparam fonlayoutchangeddelegate, ffoldablelayoutinfo ; lastly, set up the methods and member variables class foldables_tutorial_api ffoldables_helper { public static void init ; static bool haslistener; static fonlayoutchangeddelegate onlayoutchanged; }; moving to the source file foldables_helper cpp , set up the definitions for the methods and member variables created in the header file bool ffoldables_helper haslistener = false; fonlayoutchangeddelegate ffoldables_helper onlayoutchanged; void ffoldables_helper init { haslistener = true; } now, in the same source file, create the native version of the onlayoutchanged function created in the foldablehelper java file since the java onlayoutchanged function only works on android, surround the function with an #if directive to ensure that it compiles only on android #if platform_android #endif within this directive, copy the code below to use the jni definition of the java onlayoutchanged function extern "c" jniexport void jnicall java_com_samsung_android_gamedev_foldable_foldablehelper_onlayoutchanged jnienv * env, jclass clazz, jobject jfoldablelayoutinfo { create the ffoldablelayoutinfo to store the data retrieved from java ffoldablelayoutinfo result; retrieve the field ids of the foldablelayoutinfo and rect objects created in the java file //java foldablelayoutinfo field ids jclass jfoldablelayoutinfocls = env->getobjectclass jfoldablelayoutinfo ; jfieldid currentmetricsid = env->getfieldid jfoldablelayoutinfocls, "currentmetrics", "landroid/graphics/rect;" ; jfieldid maxmetricsid = env->getfieldid jfoldablelayoutinfocls, "maxmetrics", "landroid/graphics/rect;" ; jfieldid hingeorientationid = env->getfieldid jfoldablelayoutinfocls, "hingeorientation", "i" ; jfieldid stateid = env->getfieldid jfoldablelayoutinfocls, "state", "i" ; jfieldid occlusiontypeid = env->getfieldid jfoldablelayoutinfocls, "occlusiontype", "i" ; jfieldid isseparatingid = env->getfieldid jfoldablelayoutinfocls, "isseparating", "z" ; jfieldid boundsid = env->getfieldid jfoldablelayoutinfocls, "bounds", "landroid/graphics/rect;" ; jobject currentmetricsrect = env->getobjectfield jfoldablelayoutinfo, currentmetricsid ; //java rect object field ids jclass rectcls = env->getobjectclass currentmetricsrect ; jfieldid leftid = env->getfieldid rectcls, "left", "i" ; jfieldid topid = env->getfieldid rectcls, "top", "i" ; jfieldid rightid = env->getfieldid rectcls, "right", "i" ; jfieldid bottomid = env->getfieldid rectcls, "bottom", "i" ; retrieve the current windowmetrics and store it in the ffoldablelayoutinfo as an fintvector4 // currentmetrics int left = env->getintfield currentmetricsrect, leftid ; int top = env->getintfield currentmetricsrect, topid ; int right = env->getintfield currentmetricsrect, rightid ; int bottom = env->getintfield currentmetricsrect, bottomid ; // store currentmetrics rect to fvector4 result currentmetrics = fintvector4{ left, top, right, bottom }; do the same for the other variables in the java foldablelayoutinfo // maxmetrics jobject maxmetricsrect = env->getobjectfield jfoldablelayoutinfo, maxmetricsid ; left = env->getintfield maxmetricsrect, leftid ; top = env->getintfield maxmetricsrect, topid ; right = env->getintfield maxmetricsrect, rightid ; bottom = env->getintfield maxmetricsrect, bottomid ; //store maxmetrics rect to fvector4 result maxmetrics = fintvector4{ left, top, right, bottom }; int hingeorientation = env->getintfield jfoldablelayoutinfo, hingeorientationid ; int state = env->getintfield jfoldablelayoutinfo, stateid ; int occlusiontype = env->getintfield jfoldablelayoutinfo, occlusiontypeid ; bool isseparating = env->getbooleanfield jfoldablelayoutinfo, isseparatingid ; // store the values to an object for unreal result orientation = tenumasbyte<efoldorientation> hingeorientation + 1 ; result state = tenumasbyte<efoldstate> state + 1 ; result occlusiontype = tenumasbyte<efoldocclusiontype> occlusiontype + 1 ; result isseparating = isseparating; // boundsrect jobject boundsrect = env->getobjectfield jfoldablelayoutinfo, boundsid ; left = env->getintfield boundsrect, leftid ; top = env->getintfield boundsrect, topid ; right = env->getintfield boundsrect, rightid ; bottom = env->getintfield boundsrect, bottomid ; // store maxmetrics rect to fvector4 result foldbounds = fintvector4{ left, top, right, bottom }; broadcast the result via the onlayoutchanged delegate for use in the engine if ffoldables_helper haslistener { ue_log logtemp, warning, text "broadcast" ; ffoldables_helper onlayoutchanged broadcast result ; } } create a player controller and two ui states this section focuses on adding a player controller and creating two user interface ui states for flat and flex modes these objects are needed for the flex mode logic implementation following are the steps to add a player controller and create two ui states add a new player controller blueprint in content browser, go to content > thirdpersoncpp and right-click on blueprints > add/import content > blueprint class pick player controller as its parent class rename it as flexplayercontroller notethe flexplayercontroller added is generic and can be replaced by your custom player controller in an actual project add a new c++ class with actor component as its parent class name it as foldables_manager and assign it to the foldables_tutorial plugin click the create class button open the flexplayercontroller blueprint by double-clicking it click open full blueprint editor attach the actor component to the flexplayercontroller in the left pane, click add component, then find and select the foldables_manager next, create a pair of userwidget classes for the ui layouts needed flat mode ui for the full screen or normal mode; and flex mode ui for split-screen in add c++ class window, select the show all classes checkbox find and pick userwidget as the parent class then, click next name the new user widget as flatui and attach it to the plugin click next repeat the process but name the new user widget as flexui you might get an error when trying to compile stating that the userwidget is an undeclared symbol to fix this, open the foldables_tutorial build cs file, and in the publicdependencymodulenames addrange call, add "inputcore" and "umg" to the list create a pair of blueprints made from subclasses of these two user widgets right-click on content and create a new folder called foldui inside the newly created folder, right-click to add a new blueprint class in all classes, choose flatui and click the select button rename the blueprint as bp_flatui in the same folder, repeat the process but choose the flexui class and rename the blueprint as bp_flexui double-click on bp_flatui and bp_flexui, then design your two uis like below to visualize switching between flat and flex mode flat ui flex ui notethis code lab activity does not cover the steps on how to create or design ui if you want to learn about how to create your own game design in unreal engine 4, refer to unreal motion graphics ui designer guide implement the flex mode logic after creating the flexplayercontroller and the two ui states bp_flatui and bp_flexui , you can now implement flex mode logic in the foldables_manager open the foldables_manager h and include the necessary c++ header files #pragma once #include "coreminimal h" #include "components/actorcomponent h" #include "engine h" #include "flatui h" #include "flexui h" #include "foldables_helper h" #include "foldables_manager generated h" remove the line below to save a little bit of performance as this component doesn't need to tick public // called every frame virtual void tickcomponent float deltatime, eleveltick ticktype, factorcomponenttickfunction* thistickfunction override; set up the functions needed in foldables_manager the constructor, a function to create the ui widgets the implementation of onlayoutchanged delegate public // sets default values for this component's properties ufoldables_manager ; void createwidgets ; protected // called when the game starts virtual void beginplay override; protected void onlayoutchanged ffoldablelayoutinfo foldablelayoutinfo ; then, set up the variables needed references to the flat and flex ui classes references to the flat and flex ui objects mark the pointers as uproperty to ensure that garbage collection does not delete the objects they point to tsubclassof<uuserwidget> flatuiclass; tsubclassof<uuserwidget> flexuiclass; uproperty class uflatui* flatui; uproperty class uflexui* flexui; finally, define a new private function restoreflatmode , to disable flex mode and return to normal mode private void restoreflatmode ; moving over to foldables_manager cpp, implement the constructor using the constructorhelpers, find the ui classes and set the variables to store these classes also, set the bcanevertick to false to prevent the component from ticking and remove the code block of tickcomponent function // sets default values for this component's properties ufoldables_manager ufoldables_manager { primarycomponenttick bcanevertick = false; static constructorhelpers fclassfinder<uflatui> flatuibpclass text "/game/foldui/bp_flatui" ; static constructorhelpers fclassfinder<uflexui> flexuibpclass text "/game/foldui/bp_flexui" ; if flatuibpclass succeeded { flatuiclass = flatuibpclass class; } if flexuibpclass succeeded { flexuiclass = flexuibpclass class; } } next, set up the beginplay function to link the delegate to the onlayoutchanged function, to initialize the foldables_helper, and to create the widgets ready for use in the first frame // called when the game starts void ufoldables_manager beginplay { super beginplay ; ffoldables_helper onlayoutchanged adduobject this, &ufoldables_manager onlayoutchanged ; ffoldables_helper init ; createwidgets ; } set up the createwidgets function to create the widgets using the ui classes acquired in the constructor add the flatui widget to the viewport, assuming the app opens in normal mode until it receives the foldablelayoutinfo void ufoldables_manager createwidgets { flatui = createwidget<uflatui> aplayercontroller* getowner , flatuiclass, fname text "flatui" ; flexui = createwidget<uflexui> aplayercontroller* getowner , flexuiclass, fname text "flexui" ; flatui->addtoviewport ; } afterward, create the onlayoutchanged function, which will be called via a delegate inside this function, check whether the device’s folded state is half_opened if so, check whether the orientation of the fold is horizontal void ufoldables_manager onlayoutchanged ffoldablelayoutinfo foldablelayoutinfo { //if state is now flex if foldablelayoutinfo state == efoldstate half_opened { if foldablelayoutinfo orientation == efoldorientation horizontal { notefor this third person template, splitting the screen vertically isn’t ideal from a user experience ux point of view for this code lab activity, split the screen only on the horizontal fold top and bottom screen if you want it vertically, you need to use the same principle in the next step but for the x-axis instead of the y-axis you must also ensure that you have a flex ui object for the vertical layout if the device is both on flex mode and horizontal fold, change the viewport to only render on the top screen using the normalized position of the folding feature then in an asynctask on the game thread, disable the flatui and enable the flexui however, if the device is on normal mode, then return to flat ui using restoreflatmode function //horizontal split float foldratio = float foldablelayoutinfo foldbounds y / foldablelayoutinfo currentmetrics w - foldablelayoutinfo currentmetrics y ; gengine->gameviewport->splitscreeninfo[0] playerdata[0] sizex = 1 0f; gengine->gameviewport->splitscreeninfo[0] playerdata[0] sizey = foldratio; asynctask enamedthreads gamethread, [=] { if flatui->isinviewport { flatui->removefromparent ; } if !flexui->isinviewport { flexui->addtoviewport 0 ; } } ; } else { restoreflatmode ; } } else { restoreflatmode ; } } reverse the flex mode implementation logic to create the restoreflatmode function by setting the viewport to fill the screen, then disable the flexui and enable the flatui void ufoldables_manager restoreflatmode { gengine->gameviewport->splitscreeninfo[0] playerdata[0] sizex = 1 0f; gengine->gameviewport->splitscreeninfo[0] playerdata[0] sizey = 1 0f; asynctask enamedthreads gamethread, [=] { if !flatui->isinviewport { flatui->addtoviewport 0 ; } if flexui->isinviewport { flexui->removefromparent ; } } ; } set up a game mode and attach the flexplayercontroller the game mode defines the game rules, scoring, and any game-specific behavior set up the game mode in unreal editor by creating a blueprint class in the content > thirdpersoncpp > blueprints folder pick game mode base as the parent class and rename it as flexgamemode double-click on flexgamemode in the drop-down menu next to player controller class, choose the flexplayercontroller lastly, go to edit > project settings > project > maps & modes and select flexgamemode as the default gamemode build and run the app go to edit > package project > android to build the apk ensure that the android development environment for unreal is already set up to your computer noteif the build failed due to corrupted build tools, consider downgrading the version to 30 or lower using the sdk manager or, simply rename d8 bat to the name of the missing file dx bat in sdk path > build-tools > version number directory and, in lib folder of the same directory, rename d8 jar to dx jar after packaging your android project, run the game app on a foldable galaxy device and see how the ui switches from normal to flex mode if you don’t have any physical device, you can also test it on a remote test lab device tipwatch this tutorial video and know how to easily test your app via remote test lab you're done! congratulations! you have successfully achieved the goal of this code lab now, you can implement flex mode in your unreal engine game app by yourself! if you're having trouble, you may download this file flex mode on unreal complete code 20 16 mb to learn more, visit www developer samsung com/galaxy-z www developer samsung com/galaxy-gamedev
Learn Code Lab
codelabadd samsung in-app purchase service to your app objective learn how to integrate samsung in-app purchase iap service into your app so that users can purchase digital consumable and non-consumable items within the app registered in the galaxy store overview the samsung in-app purchase iap service offers developers a robust solution for handling digital purchases within mobile apps it ensures a smooth and secure experience when purchasing digital goods or items, managing subscriptions, or dealing with refunds and consumed items the iap sdk makes integrating the iap functionality into your app simple, allowing you to configure iap settings, retrieve item details, offer and sell items, and manage purchased items effortlessly to successfully sell in-app items, follow these four basic steps download and integrate the samsung iap sdk into your application request for commercial seller status in the samsung galaxy store seller portal upload your application’s binary file in the seller portal add in-app items to your app in-app items can be categorized into three types consumable, non-consumable, and subscription consumable these items can be used only once and can be repurchased multiple times by the app user non-consumable non-consumable items can be used any number of times and cannot be repurchased subscription with subscription items, app users can access them any number of times throughout the duration of their subscription for more information, go to samsung iap set up your environment you will need the following android studio latest version recommended samsung iap sdk latest version samsung galaxy device android 6 0 or higher samsung galaxy store seller portal commercial seller account sample code here is a sample code for you to start coding in this code lab download it and start your learning experience! in-app purchase turbobike sample code 1 3 mb start your project in android studio, click open to open an existing project locate the downloaded android project turbobike_blank_code from the directory and click ok register the app and its items in the seller portal to register the sample app along with the in-app items in the samsung galaxy store seller portal, follow these steps sign in using your commercial seller account in android studio, modify the package name of the sample app navigate to app > kotlin + java > com example turbobike view, and in the mainactivity java file, refactor the application name turbobike from the package name com example turbobike for all directories notethe package name com example turbobike is already registered in the seller portal to avoid any conflicts, rename it with a different package name build the apk from android studio and upload the binary to the seller portal once the testing process is complete and the app functions smoothly as intended, return to this step and upload the final apk file under the in app purchase tab, add three items named bike, booster, and fuel these are item ids of the in-app items created in the sample app where the bike is a non-consumable item, while both booster and fuel are consumable items when adding the bike item, uncheck this item can be purchased multiple times checkbox refer to the step-by-step guide for detailed instructions lastly, add a licensed tester to enable purchasing within the app edit your seller portal profile and include your samsung account in the license test field on the test device, sign in with the same samsung account initialize the samsung iap sdk before using the samsung iap sdk library, certain configurations are necessary, which are already applied in the sample code provided the samsung-iap-6 3 0 aar library is added to the app > libs folder, and included as a dependency in the module-level build gradle file dependencies { … implementation filetree dir 'libs', include ['* aar'] } these necessary permissions are already added in the androidmanifest xml file com samsung android iap permission billing to connect to iap and enable in-app item registration in seller portal android permission internet because iap uses the internet <uses-permission android name="com samsung android iap permission billing" /> <uses-permission android name="android permission internet" /> go to mainactivity java and in the oncreate function, create an instance of the samsung iap sdk to utilize the functionalities it offers set the operating mode to operation_mode_test to purchase items without payment and enable only licensed testers to test without incurring charges iaphelper = iaphelper getinstance getapplicationcontext ; iaphelper setoperationmode helperdefine operationmode operation_mode_test ; notebefore submitting the app for beta testing or release, change the operating mode to operation_mode_production get the list of all items owned by the user the getownedlist function returns a list of items that the user has previously purchased, including consumable items that have not been reported as consumed non-consumable items subscription items that are in free trial and active state call the getownedlist function from the iaphelper class also, check if there are any consumable items in the returned list and call the handleconsumableitems function with the purchase id of each consumable item iaphelper getownedlist iaphelper product_type_all, new ongetownedlistlistener { @override public void ongetownedproducts @nonnull errorvo errorvo, @nonnull arraylist<ownedproductvo> arraylist { if errorvo geterrorcode == iaphelper iap_error_none { for ownedproductvo item arraylist { if item getisconsumable { // consume the purchased item handleconsumableitems item getpurchaseid ; } } } else { log d "getownedproducts failed ", errorvo tostring ; } } } ; notecall getownedlist whenever launching the application to check for unconsumed items or subscription availability report consumable items as consumed mark the consumable items returned from getownedlist and those successfully purchased with startpayment as consumed by calling the consumepurchaseditems function iaphelper consumepurchaseditems itemid, new onconsumepurchaseditemslistener { @override public void onconsumepurchaseditems @nonnull errorvo errorvo, @nonnull arraylist<consumevo> arraylist { if errorvo geterrorcode == iaphelper iap_error_none { toast maketext getapplicationcontext ,"consumed successfully now you can purchase another item ", toast length_short show ; } else { toast maketext getapplicationcontext , "consume failed " + errorvo geterrorstring , toast length_short show ; } } } ; this makes the items available for repurchase, regardless of whether they are used or not in the sample app, consumable items cannot be used and it only stores the total count of the items purchased get item details to retrieve information about some or all in-app items registered to the app, use the getproductsdetails function by specifying an item id such as bike or booster, you can fetch details for a particular in-app item to obtain information about all in-app items available in the seller portal for the user, pass an empty string "" as the argument iaphelper getproductsdetails "bike, booster, fuel", new ongetproductsdetailslistener { @override public void ongetproducts @nonnull errorvo errorvo, @nonnull arraylist<productvo> arraylist { if errorvo geterrorcode == iaphelper iap_error_none { for productvo item arraylist { if item getitemid equals itemid { // set product details value to ui product settext "product name " + item getitemname ; price settext "product price " + item getitempricestring ; currency settext "currency " + item getcurrencycode ; // click continue button to purchase dialogbutton setonclicklistener dialogbtnlistener ; } } } else { toast maketext getapplicationcontext , "getproductdetails failed " + errorvo geterrorstring , toast length_short show ; } } } ; handle item purchase and payment process to initiate a purchase and complete the payment transaction process, use the startpayment function the result of the purchase is specified in the onpaymentlistener interface, which includes the detailed purchase information purchasevo in case of a successful transaction if there's an error during the payment process, an error code -1003 indicates that the non-consumable item is already purchased for further information on error responses, refer to the documentation on response codes iaphelper startpayment itemid, string valueof 1 , new onpaymentlistener { @override public void onpayment @nonnull errorvo errorvo, @nullable purchasevo purchasevo { if errorvo geterrorcode == iaphelper iap_error_none { log d "purchaseid " , purchasevo getpurchaseid ; // non-consumable item, can purchase single time if itemid equals "bike" { purchasebikebtn settext "already purchased" ; } // consumable item, can purchase multiple time else if itemid equals "booster" { handleconsumableitems purchasevo getpurchaseid ; // update booster count in ui boostercount+=1; boostercountertv settext "⚡ "+boostercount+" ev" ; }else if itemid equals "fuel" { handleconsumableitems purchasevo getpurchaseid ; // update fuel count in ui fuelcount+=1; fuelcountertv settext "⛽ "+ fuelcount+" ltr" ; } }else { // non-consumable item, already purchase if errorvo geterrorcode == -1003 { purchasebikebtn settext "already purchased" ; } } } } ; upon successfully purchasing a consumable item, the consumepurchaseditems function is called through the handleconsumableitems function the total number of purchased boosters and fuel is displayed on the app ui using the boostercountertv settext and fuelcountertv settext methods respectively run the app after building the apk, install the app on a samsung galaxy device test the app by making purchases the turbo bike can only be bought once, while either the booster or fuel can be purchased multiple times after purchasing in-app items, the app shows that the bike has already been purchased along with the number of boosters and fuel bought you're done congratulations! you have successfully achieved the goal of this code lab now, you can integrate samsung iap sdk into your application by yourself! if you are having trouble, you may download this file in-app purchase turbobike complete code 1 3 mb to learn more about developing apps with samsung iap sdk, visit developer samsung com/iap
Learn Code Lab
codelabcreate a watch face using tag expressions objective learn how to create a watch face that responds based on the date, time, step count, heart rate, and battery level using tag expressions in watch face studio in this code lab, you will create a basic watch face with complications such as step count, heart rate, and battery level later, you will improve its functionalities and make it visually dynamic using tag expressions overview watch face studio is a graphic authoring tool that enables you to create watch faces for wear os it offers a simple and intuitive way to add images and components, and to configure the watch movement without any coding watch face studio supports watch faces for the galaxy watch4 or newer version, and other watch devices that run on the same platform tag expressions are conditions in watch face studio that allows you to customize watch face through dynamic configuration of its movement and data set up your environment you will need the following watch face studio galaxy watch4 or newer any supported wear os watch start your project create a new project and input project name a blank studio will show upon clicking ok add analog hands and index watch face studio allows you to add components like text, image, shape, analog hands, and index in a watch face for your watch to have the look and feel of an analog watch, add the following components time > index time > analog hands > minute time > analog hands > hour notethe index and watch hand images used in this code lab are no longer included in the latest version of the watch face studio however, you can choose a design for the index and watch hands from available images in the resources folder you can also create and add your own design you will see that the hands move automatically and in sync with the device time select all the newly added components and click group rename the group as group_analogtime use a progress bar for seconds a component like a progress bar can be used to show how much of the process is completed and how much is left in this step, you will use it to show how far or close the next minute is to use a progress bar as seconds click add component and select progress bar rename the component to seconds move seconds behind group_analogtime in properties of seconds, do the following a adjust the dimension width and height to 395 b align the component to the center c drag the background slider to 0% d make sure that the type is a circular progress bar; otherwise change it e in range setting, change value to 0 and click tags beside it to open the tags window f type in [sec] it means that the value from 0 will increment as the value of the second increases g set max value to 59 since it is the maximum value of [sec] notein this scenario, the progress bar disappears in the canvas as the preview only uses the base value, which is 0 however, the component is still present in run format and position a digital clock in this step, you will learn how grouping works and affects its components you will also learn how to format the date and time using tags to format and position a digital clock, you need to add a digital clock > time twice rename them as hour and minute, respectively add a digital clock > date and rename the component as date put them in one group and rename it as group_digitaltime go to the properties of hour and change the text appearance to 80 do the same for minute adjust the text size of date to 15 adjust the y placements of the individual components to look like the image below when you change a certain component, it won’t affect other components in the group format hour to only show the time in hour a go to its properties and click the tags button in text field b replace text field value with [hour_0_23_z] to show the current hour with leading zero do the same for minute but replace the text field value with [min_z] to show the current minute in an hour with leading zero go to group_digitaltime placement properties and align it horizontally after that, place it to the left you will see the components adjusted as a group utilize health features and battery level watch face studio also allows you to utilize data like step count, heart rate, and battery level follow the steps below to show these real-time data using tags on texts or progress bar battery level add a circular progress bar and rename the component as battery level drag the background slider to 0% go to value properties replace the value with 0 and, in tags, input or choose [batt_per] to use the current battery percentage as the value add a circle complication slot and rename it as battery icon complications are a set of components that can be handled as one group set the type to fixed and change the default provider to watch battery select short text as complication type and choose icon + text for layout select and move battery level and battery icon together to the bottom right heart rate add a circular progress bar and rename the component as heart rate drag the background slider to 0% go to value properties replace the value with 0 and, in tags, input or choose [hr] to use heart rate as value set the max value to 240 since it's the maximum heart rate a person can have add a text component and rename it as heart rate label in the text field, input heart rate and change the text size to 12 change the y placement to 195 add another text component and rename it as heart rate text in the text field, input [hr] and change the text size to 30 group heart rate, heart rate label, and heart rate text together rename the group as group_heartrate move the group_heartrate placement to the center right step count add a circular progress bar and rename the component as step count drag the background slider to 0% go to value properties replace the value with 0 and, in tags, input or choose [sc_per] to use the current percentage to the goal of step count add a circle complication slot and rename it as step count text set the type to fixed and change the default provider to step count select short text as complication type and choose text + title for layout it will now show "steps" as title and step count as text place the step count text in the center horizontally select and move step count and step count text together to the top right select group_digitaltime, group_batterylevel, group_heartrate, group_stepcount, battery icon, and step count text drag them behind group_analoghands and seconds by doing this, the analog hands would overlap the components make use of tag expressions you already have three progress bars that show data of battery level, heart rate, and step count this time, you will make these features more functional by changing the progress bars' color to red using tag expressions tag expressions are conditions that allow you to change the rotation, placement, behavior, and opacity of a component based on tag values it can alter your watch face's appearance dynamically as the tag value changes tag expressions support different types of operators – arithmetic, relational, logical, and ternary for this step, you will apply tag expressions on the color opacity but first, you will have to duplicate all the circular progress bars seconds, battery level, heart rate, and step count move all the duplicates to a new group called group_colorchange make sure that group_colorchange is behind all other groups change individual component’s color to #ffffff or white duplicate this group and rename it as group_background move it behind group_colorchange drag the background slider to 16% and remove tags in the value properties of each component of group_background change group_colorchange color to #ff001e or red group_colorchange will be used as components underneath when you set the opacity of the main components to 0 using tag expressions group_background will serve as gap fillers of each progress bar below are conditions that will trigger the opacity of the main components to become 0 and reveal the duplicated red components change the color of the battery level to red if the battery level is equal to or less than 20% go to group_batterylevel and select battery level navigate to color properties check if the color opacity value is 100 this will serve as the base value in tags, input [batt_per]<=20?-100 0 to subtract 100 from the base value of opacity if the battery level is equal to or less than 20 otherwise, the base opacity value remains the same in the run pane, adjust the device > watch battery to 20% or less, and you will see how the color will change to red change the color of step count to red if the goal hasn't been reached yet and the time is already 18 00 6 00 pm or beyond go to group_stepcount and select step count navigate to color properties check if the color opacity value is 100 this will serve as the base value in tags, input [sc]<[sc_goal] * [hour_0_23]>=18 ?-100 0 to subtract 100 from the base value of opacity if the step count is less than the goal, and if the value of hour in a day is 18 or beyond otherwise, the base opacity value remains the same play with the time control bar in the run pane and health > steps data to see how the color will change from blue to red change the color of the heart rate and seconds to red if the heart rate is below or above the normal go to group_heartrate and select heart rate navigate to color properties check if the color opacity value is 100 this will serve as the base value in tags, input [hr]<60 + [hr]>100 ?-100 0 to subtract 100 from the base value of opacity if the heart rate is below or above the normal 60-100 otherwise, it remains the same do the same for seconds test it in the run pane by adjusting the health > heart rate to below 60 or above 100, and you will see how the color will change to red prolong the battery life now that you already know what group and tag expressions are, it's about time for you to use both to your advantage it is observed that the darker a watch face design is, the longer the battery life can be to help the watch stay powered even when there’s a little battery left, you will need to decrease the opacity of the watch face when the battery level is equal to or less than 10% to do this, you have to select and combine all created groups and components, except for group analogtime, battery icon, and step count text, to a new group called group_watchface go to group_watchface color properties and change the base opacity value to 20 in tags, input [batt_per]<=10?0 80 to add 0 to the base value of opacity if the battery level is equal to or less than 10 otherwise, it adds 80 to the base value, making the watch face 100% visible adjust the device > watch battery to 10% or less, and you will see how most components' opacity decreased choose components for always-on always-on display is a feature that allows your galaxy watch to show the time without checking on it by pressing a button or lifting your hand in watch face studio, you can choose which group or component to display on the always-on by following these steps go to the always-on tab, to see the same set of components you added and grouped click the eye icon next to the group name to hide or make it visible hide group_watchface, battery icon, and step count text at this point, your always-on display will display a basic analog watch face whenever your watch is in idle mode test the watch face to test your watch face, you need to connect a watch device to the same network as your computer in watch face studio, select project > run on device select the connected watch device you want to test with if your device is not detected automatically, click scan devices to detect your device or enter its ip address manually by clicking the + button you're done! congratulations! you have successfully achieved the goal of this code lab now, you can create and design a watch face using tag expressions by yourself! if you're having trouble, you may download this file tag expression complete project 272 71 kb to learn more about watch face studio, visit developer samsung com/watch-face-studio
Learn Code Lab
codelabdesign a watch face using mask and moon phase tags objective design a watch face that shows the eight phases of the moon using the mask feature and moon phase tags in watch face studio overview watch face studio is a graphical authoring tool that enables you to design watch faces for the wear os smartwatch ecosystem, including galaxy watch4 and newer versions it provides easy and simple features, such as masking and tag expression, for creating attractive and dynamic watch faces without coding masking is the technique of hiding or revealing parts of a layer based on the shape outline of the bottom layer you can use it to enhance visual impact, create special effects, or draw focus to specific areas of an image tag expressions are conditions in watch face studio that let you dynamically configure the movement and data of a watch face what is moon phase? the moon completes its orbit for approximately 28 days, undergoing a singular lunar cycle from new moon to new moon this lunar cycle is divided into eight distinct phases with 28 positions the visible appearance of the moon, as observed from earth, is referred to as its phase moon phase position days type of moon phase 0~0 5 new moon 0 5~0 65 evening crescent 7 first quarter 7 5~13 5 waxing gibbous 14 full moon 14 5~20 5 waning gibbous 21 last quarter 21 5~27 5 morning crescent 27 5~28 new moon set up your environment you will need the following watch face studio galaxy watch4 or newer smart watch running on wear os3 or higher sample project here is a sample project for this code lab download it and start your learning experience! moon phase sample project 1 41 mb start your project download the sample project file, and click open project in watch face studio locate the downloaded file, then click open show grid, coordinate axis and rulers to set the different positions of the moon accurately and easily, you can utilize the coordinate system of the watch face studio select the show grid, show coordinate axis, and show rulers options from the view menu it will display a grid on the canvas, the x and y axis, and rulers for precise measurement and placement of components the center placement of the entire watch face is 225,225 noteyou can change the grid's color from the preferences > view create two mask groups when you mask two or more images, the shape of the bottom-most layer determines the visible area of the mask group the layers above it appear only through the shape outline of the bottom layer for example, if you place a square image on the bottom layer and an image in the layer above it, the image appears only through the square outline of the bottom layer the sample project consists of two similar images of the moon moon_qgf and moon_nc and two different shapes as bottom layers moon_qgf_layer and moon_nc_layer using these components, create two mask groups to use for simulating eight major moon phases select moon_qgf and moon_qgf_layer images and click mask rename the mask group as moon_qgf_mask it will cover five moon phases the first quarter, waxing gibbous, full moon, waning gibbous, and last quarter do the same for moon_nc and moon_nc_layer to cover the remaining moon phases the new moon, evening crescent, and morning crescent rename the mask group as moon_nc_mask tipread use masks to get creative with watch faces to explore other possibilities of masking add tag expressions to simulate different moon phases watch face studio provides tags to determine the moon phase's type moon_ty and position moon_po the corresponding tag values per moon phase are listed in the table below moon phase [moon_ty] values [moon_po] values new moon 0 0~0 5 evening crescent 1 0 5~0 65 first quarter 2 7 waxing gibbous 3 7 5~13 5 full moon 4 14 waning gibbous 5 14 5~20 5 last quarter 6 21 morning crescent 7 21 5~27 5 new moon 0 27 5~28 using tag expressions, adjust the properties of each mask group and its bottom-most layer to dynamically show each moon phase in different placements you can lay out the moon phases as below gibbous, quarter, and full moon the moon_qgf_mask currently displays the full moon, and its placement coordinate is 195, 23 use the grid lines and rulers to determine the placement of the other four moon phases the first quarter, waxing gibbous, waning gibbous, and last quarter add tag expressions to the placement x and y and color properties of moon_qgf_mask placement - x coordinate move the mask group to the left of the full moon for the first quarter and waxing gibbous and to the right for the waning gibbous and last quarter replace each x with the distance in pixels between the x-placement of the full moon and the preferred x-placement of the other four moon phases [moon_ty] == 2 ? -x [moon_ty] == 3 ? -x [moon_ty] == 5 ? + x [moon_ty] == 6 ? + x 0 placement - y coordinate move the mask group down replace each y with the distance between the y-placement of the full moon and the preferred y-placement of the other four moon phases [moon_ty] == 2 ? + y [moon_ty] == 3 ? + y [moon_ty] == 5 ? + y [moon_ty] == 6 ? + y 0 color - opacity show moon_qgf_mask only if the mask group covers the current moon phase otherwise, hide it [moon_ty] ==2 + [moon_ty] ==3 + [moon_ty] ==4 + [moon_ty] ==5 + [moon_ty] ==6 ?0 -100 change the moon's appearance by adjusting the dimension and image placement of moon_qgf_layer using tag expressions placement - x coordinate move the image to the right of the moon image for the first quarter and waxing gibbous and to the right for the waning gibbous and last quarter replace each x with the length of the portion to hide if the moon image is 50px and the quarter moon shows only half of it, then the portion to hide is ~25px [moon_ty] == 2 ? +x [moon_ty] == 3 ? +x [moon_ty] == 5 ? -x [moon_ty] == 6 ? - x 0 placement - y coordinate move the image up for the first and last quarter [moon_ty] == 2 ? -y [moon_ty] == 6 ? -y 0 dimension - height for the first and last quarter, adjust the height h to transform the image from a circle to an oval shape to simulate the appearance of a quarter moon [moon_ty] ==2 ? h [moon_ty] ==6 ? h 0 crescent and new moon the moon_nc_mask currently displays the evening crescent, and its placement coordinate is 6, 110 changing its placement and dimension properties can show the rest of the moon phases the morning crescent and the new moon similarly, add tag expressions to the properties of moon_nc_mask placement - x coordinate move the mask group slightly to the left of the evening crescent when the new moon's position is 0 5 or less otherwise, move the mask group to the opposite side of the watch face; the same for the morning crescent replace each x with the distance between the x-placement of the evening crescent and the preferred x-placement of the other moon phases [moon_ty] == 0 ? [moon_po] <= 0 5 ? -x +x [moon_ty] == 7 ? +x 0 placement - y coordinate move the mask group down for the new moon replace y with the distance between the y-placement of the evening crescent and the preferred y-placement of the new moon [moon_ty] == 0 ? +y 0 color - opacity show moon_nc_mask only if the mask group covers the current moon phase otherwise, hide it [moon_ty] ==0 + [moon_ty] ==1 + [moon_ty] ==7 ?0 -100 change the moon's appearance by adjusting the image placement of moon_nc_layer using tag expressions placement - x coordinate move the image slightly to the right of the moon image when the new moon's position is 0 5 or less otherwise, move the image to the left replace each y with the distance between the initial x-placement of the layer and the preferred x-placement; to hide portions of the moon image to simulate the appearance of the other moon phases [moon_ty] == 0 ? [moon_po] <= 0 5 ? +y -y [moon_ty] == 7 ? -y 0 test the watch face in the run pane, click the preview watch face icon adjust the date to see the moon change from one phase to another you can check for a complete lunar cycle from 18 july 2023 to 16 august 2023 to test your watch face on a smart watch, you need to connect a watch device to the same network as your computer in watch face studio, select run on device select the connected watch device you want to test with if your device is not detected automatically, click scan devices to detect your device or enter its ip address manually by clicking the + button notethe always-on display is already set in the project to run the watch face successfully, you may need to configure its always-on display to avoid any error when you run on device you're done! congratulations! you have successfully achieved the goal of this code lab now, you can use mask and moon phase tags for making a dynamic watch face in watch face studio all by yourself! if you're having trouble, you may download this file moon phase complete project 1 87 mb to learn more about watch face studio, visit developer samsung com/watch-face-studio
Learn Developers Podcast
docseason 2, episode 7 previous episode | episode index | next episode this is a transcript of one episode of the samsung developers podcast, hosted by and produced by tony morelan a listing of all podcast transcripts can be found here host tony morelan senior developer evangelist, samsung developers instagram - twitter - linkedin guests eric cloninger, lead, developer relations team, samsung electronics chris shomo, infinity watchfaces listen download this episode topics covered sdc21, virtual conference history of the samsung developer conference conference audience keynote speakers conference announcements technical sessions expo floor galaxy store gallery code lab virtual reality after-hours party chris shomo, infinity watchfaces watch face studio 2020 best of galaxy store awards 2021 best of galaxy store awards bixby developers one ui beta samsung podcast platform smartthings helpful links sdc21, virtual conference - developer samsung com/sdc sdc18 highlights - youtube video sdc19 highlights - youtube video sdc19 replay - youtube video sdc21 preview - youtube video code lab - developer samsung com/codelab chris shomo, infinity watchfaces - youtube video watch face studio - developer samsung com/one-ui-watch 2020 best of galaxy store awards - youtube video 2021 best of galaxy store awards preview - youtube video bixby developers - bixbydevelopers com/ one ui beta - developer samsung com/one-ui-beta/index html samsung podcast platform - samsungpodcasts com/ smartthings - developer samsung com/smartthings samsung developers homepage - developer samsung com samsung developers newsletter - developer samsung com/newsletter samsung developers blog - developer samsung com/blog samsung developers news - developer samsung com/news samsung developers facebook - facebook com/samsungdev samsung developers instagram - instagram com/samsung_dev samsung developers twitter - twitter com/samsung_dev samsung developers youtube - youtube com/samsungdevelopers samsung developers linkedin - linkedin com/company/samsungdevelopers eric cloninger linkedin - linkedin com/in/ericcloninger/ chris shomo linkedin - linkedin com/in/christopher-shomo tony morelan linkedin - linkedin com/in/tony-morelan transcript note transcripts are provided by an automated service and reviewed by the samsung developers web team inaccuracies from the transcription process do occur, so please refer to the audio if you are in doubt about the transcript tony morelan 00 01 hey, i'm tony morelan and this is pow! the samsung developers podcast where we chat with innovators using samsung technologies, award winning app developers and designers, as well as insiders working on the latest samsung tools welcome to season two, episode seven today's show is a special episode of the pow! podcast last year, we were not able to have our annual samsung developer conference because of the pandemic but this year, we're back with sdc21, a virtual conference this coming october, i sat down with eric cloninger, who leads developer relations at samsung not only do we talk about some of the highlights from our past developer conferences, but what you can look forward to at this year's sdc21 enjoy hey, eric, welcome to the podcast eric cloninger 00 51 hey, tony glad to be here tony morelan 00 53 so i couldn't be more excited about this special episode where we get to chat about not only the past samsung developer conferences, but our upcoming sdc21 eric cloninger 01 03 yeah, it's gonna be a lot of fun it is different this year for certain tony morelan 01 06 let me first start off by asking what exactly is the samsung developer conference, eric cloninger 01 11 samsung creates a lot of different platforms and sdks for developers to create for and integrate with so sdc is one of the ways we promote our platforms, and educate developers on their capabilities like many companies, we realized that developers add a lot of value to our products with their own creations so sdc is our opportunity to share knowledge and hopefully build a connection to the people that are making our products better tony morelan 01 36 yeah, and what's unique with sdc 21 is this year, it's actually going to be a virtual conference now we know that it's because the current pandemic we're in, but it's, i think, an opportunity for samsung really to reach to a much bigger global audience that will be able to come in and attend our conference eric cloninger 01 55 certainly, you know, in the years past, it's been a live event and there would be quite a few people there -- several thousand now with it being virtual, we have a much bigger audience and people can actually see the technical sessions as well as the keynote online even though it's not in person, it is still something that where we can share knowledge, and people can give us feedback on what they like and don't tony morelan 02 21 let's go back and talk a little bit about the history of sdc i think it started back in 2013 is that correct? that's correct eric cloninger 02 29 and i was there in 2014, talking about the gear watch tony morelan 02 34 development wow, that must have been pretty close to when we first launched the watch eric cloninger 02 39 i think it was the first gear s was the product that that i was working on and we were talking about development tools and how to write apps for those watches tony morelan 02 49 since then, we've done seven sdcs that, you know, there was a year i think around 2015 that we skipped and of course last year, we did have to hold off on doing an actual conference past locations, primarily san francisco in the bay area eric cloninger 03 06 it's been at moscone every year until 2019, when it moved to san jose so it's always been in the bay area somewhere that people who attend tony morelan 03 15 tell me about, you know, what is what is the audience eric cloninger 03 19 the audience is primarily developers and the content is really focused on that group a lot of samsung employees attend to give the technical talks and a lot to people come from all over the world to work in the booths and on the show floor in one sense sdc is like a family reunion, we get a chance to meet the people that we've emailed with and been on web conferences for a long time that's a chance to come together but it's also the fruition of a year of hard work, you'll whether it's virtual or in person, we can use the opportunity to celebrate and to share what we've worked on with third party developer community tony morelan 04 05 yeah, i know, my first sdc was 2018 that was in san francisco i hit started at samsung just a few months earlier than that so it was a great opportunity, really, for me to meet, not just some of these employees that had only been, you know, emailing with but a lot of the partners that we had a great report with sdc 19 eric cloninger 04 29 i think there was over 5000 close to 6000 people that it's been five to 6000 every year since that i've been here yeah, so that's a fairly good-sized conference tony morelan 04 37 so let's talk about some of the past keynotes and some of the big announcements that we've made going back to 2017 i think we had stan lee, is that correct? eric cloninger 04 47 yeah, stan lee from marvel was one of the main speakers that was pretty interesting in 2018, we had a lot of people watching because that's the day that they announced the galaxy fold wow so the first time anybody saw it was on stage at sdc and there were probably a half a million people watching live on either facebook live or youtube tony morelan 05 13 i remember my takeaway from sdc18 was tim sweeney for fortnite epic games? eric cloninger 05 18 absolutely on stage with one of our vps who was holding your tiny sword and shield you know, it just it added to the silliness, but also the fun was pretty, pretty fun tony morelan 05 33 oh, definitely now sdc 19 we had another very interesting person up on the stage talk a little bit about vitalik eric cloninger 05 41 yeah, vitalik buterin is the co-founder of ethereum and that year, we also had justin sun from tron the blockchain community is very interesting and it's definitely a new aspect for samsung is we had the blockchain wallet sdk that was coming out that year and so we wanted to have people that could talk about their interactions with it so vitalik and justin, were on stage in the spotlight session on day two tony morelan 06 09 yeah, that was pretty exciting actually, to see him up on stage they're in live in person so a big part of our conference are the technical sessions, it's a chance for the community really to learn about new and upcoming technologies talk a bit about some of those sessions that we've had in the past eric cloninger 06 27 so pretty much any of samsung's technical features sdks and services have sessions at sdc so if you're interested in ai and voice activated services, you can go to multiple bixby sessions, if you're into the internet of things and how to integrate into samsung smartthings ecosystem, there will be information there you know, as i mentioned previously, there's blockchain, there's the knox partnership for if you want to do secure computing, one ui if you're a designer, and all the new foldable phones and devices out there, there's a lot of content around how to handle app continuity and the flex mode, as well as the unique things about foldable design that you can learn about, as well as things like samsung health and how to design for themes there's a wide range of technical sessions for pretty much anybody at any experience level tony morelan 07 24 yeah, yeah, in my area of involvement with the developer conference has been around that design side i mean, as you know, my background is in design, you know, when we are giving the sessions on theme, designing watchface designing that that's really where i get my involvement with so a lot of fun for me to be at the conference walking around the expo floor has been one of the most exciting things for me to be there because truthfully at these different conferences, you just don't know what you're going to see and i remember walking in the room if it was sdc 18 or 19 but seeing this awesome car on the expo floor, the harmon car eric cloninger 08 00 yeah, the great thing about the expo floor is where you, you get to do a lot of the kind of non-technical learning it's a great place in a more relaxed atmosphere to meet and talk to people about what's going on so the harmon car harman is a subsidiary of samsung, and they create high end audio equipment so i'm sure you're familiar with brands like harman, kardon, or jbl, or infiniti, all very high-end brands harman also creates infotainment systems and telematics solutions for automakers and so what they would do for several years is they would bring a car onto the show floor and deck it out with a lot of the latest software and hardware, as well as the audio systems for the attendees to sit in the car and try it out unfortunately, they wouldn't let us drive it around the show floor obviously tony morelan 08 47 i will say i actually did ride the elevator with the person who drove the car from southern california up to northern california for the show so i did get to ask a little bit about you know what it is like to get behind the wheel of that car and she said it was an absolute blast to drive it up five eric cloninger 09 04 i'm sure they had to go the speed limit though tony morelan 09 06 definitely i know that smart things back in 14, one of our first conferences they actually set up like what they call the connected home eric cloninger 09 14 yeah, it was actually a full size when not full sizes about a 900 square foot, you know, a 30 by 30 area where they had different rooms and inside each of those rooms, they would have different ways that you could integrate different iot solutions into the smart home tony morelan 09 32 now just to be clear, a 900 square foot home in san francisco actually is full size so in 2018, we did something i was actually pretty excited about we created what we called a gallery of theme so you know as you know, with the galaxy store, designers can publish their phone themes, but what we did is we took those designs and actually built like a museum gallery big, full size images of the different themes nicely framed, and people would walk around this gallery and not only see this beautiful, much larger than life theme design but this was a gallery where at the end of the conference, we actually raffled off the different pieces, eric cloninger 10 15 it really shows how we have a lot of incredibly creative people who are creating work for the galaxy store, and samsung galaxy devices all of those things that were shown in that that gallery are available for anyone to download and purchase on the galaxy store tony morelan 10 31 yeah, i know that that gallery really, really was a success in a lot of people really enjoyed seeing that worked in person another area of the floor that i saw had a lot of activity was code lab, talking about what exactly is code lab at the at the conference eric cloninger 10 46 code lab is an interactive learning experience, you don't have to actually be present at sdc to be able to use it samsung employees create guided learning modules, with examples and downloadable code snippets that you can use to learn anything from android development, watch face design, or theme by the time you've gone through everything tony morelan 11 13 so if people want to learn more about code lab outside of the conference, where can they find that information, eric cloninger 11 18 you can find the code lab on the samsung developer portal at developer samsung com/codelab tony morelan 11 26 so i think one of the most exciting things that i saw happen on the expo floor was the vr team, they set up this like photography studio that talk about that eric cloninger 11 36 so in 2018, that team created what was called a volumetric camera setup so it had cameras in a lot of different positions in 360 degrees so they would take a very detailed scan of your body, and then they would print it out on a 3d printer and so that was really cool and then the following year, that same team took that that same type of technology, and they integrated it with a live interactive experience called delusion and delusion was a very creepy, interactive experience where you interacted with all of these crazy characters and because of the time of the year, it was october 29, and 30th so it's just the day before halloween, okay, you had all of these various characters that you were interacting with in a 3d experience and the thing that was cool about it was the second night, we had this, you know, after hours segment and those characters in the game that actually came to life, and you actually saw these people walking around that you had interacted with, in the interactive exhibit tony morelan 12 49 yeah, i remember that being a very fun and freaky evening, i was i was working in one of the booths behind the scenes doors were closed and as they were prepping for the opening of the of the doors, the fog machine was rolling, that people started rushing in and then i saw those characters that had been in that interactive space, actually walking amongst the people and there were a few times that in a fun way, those a little not at ease with them with those different folks eric cloninger 13 23 yeah, it was kind of a creepy experience because some of those characters, i mean, they stayed in character, and they got to look right through you and it just it was very creepy experience so the after-hours is a lot of fun at you at sdc as it is, with a lot of events, it's an it's an opportunity to kind of be a lot more relaxed you'll see some people that you saw in the, the technical sessions earlier in the day, and you have a chance to maybe drill down a little deeper while you have, you know, a plate of food and beverage in your hand so it's a good experience overall and you know, to be honest, i'm looking forward to when we can do that again tony morelan 14 02 yeah, yeah, hopefully, hopefully that will be next year so i thought it would be nice if we brought in a designer slash developer who has been very involved with the samson community and who has not only attended and many of the past sdc conferences, but was also invited to speak at one of the past sessions chris shomo, from infinity watchfaces eric cloninger 14 20 hey, chris, welcome to the show chris shomo 14 23 hey, thank you for having me on here tony morelan 14 25 yeah, no, it's great it's great to have you on the podcast so looking back at the samsung developer program, chris has been one of those resources that we've turned to many times and it simply comes down to not only your success, but your willingness to share and, and really help grow the entire ecosystem for samsung watchfaces and galaxy devices chris shomo 14 43 well, one thing that i've learned is all about the community that's one of the reasons i love to share things that i find out because i've also reached out to other designers and ask them, you know, hey, how do you do this? how do you do that? and they're more than willing to share back so it really is a given take type of thing and you know, if you're nice, then you can find some answers that you're looking for out there tony morelan 15 04 there you go definitely and you know, honestly, the more success there is amongst all the designers just the more vibrant the galaxy store is just with, with lots of great content chris shomo 15 13 oh, yeah and just how it developed over time, too, because, like i've seen it, since the very beginning, when there was hardly anything on there and then just watching it explode to all these designs that you can't even imagine what's going to pop on there next it's exactly designed to blow me away all the time tony morelan 15 29 so chris is the person behind infinity watch faces, and truly is one of the first designers who started creating for the platform tell me what year was it that you actually started designing and selling on galaxy store? chris shomo 15 39 oh, goodness 2016 tony morelan 15 41 wow yeah so i actually did an episode on the podcast on chris last year, it was great episode, we talked about how you got your start creating for samsung and, and also that your house in savannah, georgia was featured in an episode of ghost hunters that it is haunted? chris shomo 15 56 yes, it is it's been quite an experience, even though i do believe that the ghost does appreciate me being here, i believe i do not know that but she's been pretty nice tony morelan 16 08 guys nice so if you want to learn much more about chris, go back to that episode and check it out it was it was a great show so in 2017, before i started working with samsung, you were actually invited to come out to san francisco and speak at the conference tell me about that chris shomo 16 22 wow, it was quite an experience and first off, it was my first developers conference, first type of any type of tech conference so i was a little nervous in the very beginning because here i am, i'm going to san francisco, and i'm getting ready to speak in front of a lot of other designers and developers what an experience it was great tony morelan 16 43 i'm sure it was nice to actually meet also the people, you know, not only at samsung, but then you know, some of the fellow developers that are part of this community chris shomo 16 51 yeah, and also met a lot of people that became future designers of for specifically watch faces, which was wonderful they always come back to me and be like, hey, i was there and i'm like, i remember you and you know, and they take off and they do very well yeah tony morelan 17 06 so i actually came across a video on youtube of you speaking at the conference and that's how i actually got my start how i first discovered that, you know, you can create these watch faces and, and start selling them for samsung now, i took it a step further and actually started working for samsung eventually chris shomo 17 23 yep and i think that's amazing i remember you sent me an email one time actually telling me that i had a typo on my website that's right and i was like, whoa, thank you, because it was just, uh, you know, no one wants a stupid typo on their website so i got that fixed and, and then i never knew that, you know, i'd be working with yeah, back and forth, like we are now and stuff so it's great it's amazing how everything is connected tony morelan 17 49 yeah so earlier this year, we announced a partnership with google and warehouse and introduced watch face studio to new tool for designing galaxy watch faces that are sold on the google play store when the tool was first developed, we asked you to be part of that early access team so can you tell me about that experience, how it is working with that tool, and what it's like to now publish on google play? chris shomo 18 10 well, first off, thank you for getting me in there and you recommended me for being part of that team and it was excellent to be part of it, because i was able to kind of push it to its limits for animations i had a really long animation, i was testing with it and i was sending it back and forth with samsung and it helped them iron out and smooth out how the animations were working on the watch and that was great and, you know, of course, there's going to be a little bit of growing pains in the very beginning we're working on that but it's been amazing how the team at samsung has been so responsive and to get the software right for us you can really create some masterpieces so i'm excited about this tony morelan 18 55 yeah, and that's why i thought it was so important to have you part of that team is because really your designs are not like the typical design i mean, you really do push the software to try and get the most out of it you know, they're there's fun, they're quirky, i mean animations are a huge part of your designs so is there anything new and exciting that we can anticipate coming out in the in the near future? chris shomo 19 15 oh, wow i don't really know myself because i kind of jumped around so much with these designs, which is another reason why yeah, i guess it's kind of unexpected and surprising when another one comes out at one time you'll have like dancing tigers in the next second you have dolphins and sea turtle swimming i'm working on getting one onto the google play store right now called flip out that has the dolphins and the sea turtles and then tiger time as well and then we got a giant eyeball for halloween that she's showing up so yeah, a bunch of different things tony morelan 19 48 you've got it in there they're super crazy they're very artistic chris shomo 19 51 thank you yeah, and it also one of the things that i like to concentrate on is trying to bring joy to people with the watch face is where they look at it and you know, just for a moment of time, they can actually, you know, take a break from reality, they get absorbed into the watch smile for a minute if that happens, and i know it's exceeded tony morelan 20 13 it also what i love is how you build in this sort of like goals where the watch will change, like, lets you step into an example, as you're reaching your different step goals throughout the day, your watch face then is also changing throughout the day chris shomo 20 27 and that started out of course, with the ties and watches and it worked with every one step goal percentage that they set with the watch and that was another thing that i'm glad i was in the beta because i was really expressing how much we needed a step goal percentage and to work with it, and they added it in after i requested it and it was really quick and of course there are some differences where we have to set the watch pace to its unique step goal as opposed to the user set step go but that's because of that they're trying to make it so it's compatible with all the different watches and where it was but that's cool, it opens up a new line of challenge faces where you can reach 1000 steps for this to happen 2000 steps for this to happen and i think it's really going to open the door for a lot of unique and creative designs tony morelan 21 17 you know, you brought up a great point that i always stress and that is how approachable samsung is to our developer community samsung really does listen to our developers and we actually want to have that one on one communications you know, through our different channels, it is really easy to reach out to us and we'll give you that that personal attention that we know our developers need when they're creating for samsung chris shomo 21 39 and i've really watched the developers program grow over time too because back in 2016 you know it was kind of a shot in the dark but everybody was like new to it samsung was new to this the watch faces and working with this well ready to be flooded of designers that are getting ready to come in and then every one of samsung embraced us we feel like we're part of a family tony morelan 22 02 thanks thanks, chris i got to thank you for jumping in and joining us on the podcast when sdc is back in person i hope to see you there, if not sooner, i will definitely be there chris shomo 22 10 count me in tony morelan 22 12 awesome thanks, chris thanks eric cloninger 22 15 it was great to hear from chris he's a part of the community of designers and developers that really make the galaxy store special tony morelan 22 22 yeah, he's been there from pretty much day one so it was great to catch up with chris and like i said, i can't wait to actually see him in person so it past sdcs, we've done what's called the best of galaxy store awards, i think, sec 18 was the first time that we did the show at the conference sec 19 that's when i actually hosted it down in san jose, it was great we have a lot of the winners actually, at the conference, we're able to recognize them for the great apps that they've created for galaxy store however, last year in 2020, because we did not have a conference, we did a virtual award show this was presented on youtube as a life premiere and it really actually was a lot of fun because we were able to reach out to a quite a big audience eric cloninger 23 09 one of the things i thought was cool about that once we all said in the chat room, it was in the early evening us time, but there were people logging in from russia and the czech republic and slovenia all of these developers and designers who had created things in one go is the middle of their night, but they were on there congratulating each other tony morelan 23 29 i think it really shows how the award show is really a global award show i mean we've got winners from all around the world winners from large companies down to indie designers and developers and it really is a huge, huge community eric cloninger 23 45 i think it shows how the galaxy store enables a lot of smaller operations, smaller individuals who may get lost in a larger organization that they can actually create something and monetize it and enjoy the success that they can have from their own work tony morelan 24 03 yeah, no that's very true that being said, though, there have been some pretty big names that we've recognized with awards in the past we've given awards to tik tok, epic games fortnite, microsoft with their franchise forza, top golf, that was another one and then there's a great company butterfly affected that his license big brands like spongebob, hello kitty, and star trek, it was great to see them recognized for their work eric cloninger 24 31 and also last year, for the first time, bixby developers had the opportunity to have their capsules judged and in 2020 the winner was spotify tony morelan 24 43 yeah, it was a lot of fun i actually worked on many of the trailers that were shown in the award show and spotify was one of the ones that i really, really enjoyed doing, not only the voiceover for but integrating the music and all the editing that was that was a lot of fun to work on that project and we look forward to that in 2021 eric cloninger 24 59 and so when is the award show this year tony morelan 25 05 so the award show will be part of sdc so that is on october 26 later on in the evening, though, we're going to be doing a premiere on youtube at 6pm eastern, and we will be participating in a live chat so we would love for, you know, not only the winners will be on participating in this live chat, but we would love just to have the community on there so we can all get together as a chance to, you know, congratulate the winners, and really talk about all of the great apps that were recognized during the award show eric cloninger 25 35 yeah, the one thing about this, that i think we did have a lot of fun with it last year, and we hope to have more fun this year in that chat session, the invitation goes out to really everyone who is interested in the galaxy ecosystem and that could be anybody who is a user or a consumer or a developer or a designer you know, we want to we want to celebrate everyone's hard work tony morelan 25 59 definitely, definitely and if you would like to actually go back and see who the previous winners are, and actually learn more about this upcoming award show, you can go over to developer samsung com forward slash awards to learn more about the best of galaxy store award show so let's talk about sdc 21 as you know, it's a virtual show that will be on october 26 where can people find out more information about registering to attend the virtual conference? eric cloninger 26 28 so the conference is free for anyone to attend, and you can learn more at developer samsung com slash sdc tony morelan 26 38 let's talk about some of the sessions what can you share about the sessions at sdc 21? eric cloninger 26 44 well, i don't want to steal any of the thunder from the product teams have been working so hard for the last year but it will tell you that most every technology team that is working on products at samsung will have something to talk about at sdc so if you're interested in the one ui beta, you'll learn a lot more about that at the sessions, the watchface tools, there's a podcasting platform that's brand new that i think you know something about, tony morelan 27 09 yeah, yeah, no, i am helping out the podcast platform team we're excited samsung has their new podcast platform, making it easy for users to listen to podcasts and we're really excited because in october, we're going to be expanding this platform to countries in europe so it's really a big deal you can check out my session and i kind of walk you through how it is that you submit your podcast to samsung so do you have any insight on what is going to be featured in the keynote, eric cloninger 27 38 i do have a little bit of information to share and one of the things that is always kind of fun with the keynote at sdc is that samsung president dj koh will be speaking as well as many other people from within the design and engineering teams at samsung as you know, the last physical sdc was in 2019, your seems like our world has kind of stopped but to be honest, the pace of technology keeps on moving and so nearly every samsung technology team will be there and they want to talk about all the innovation creation that they've done in the last two years so there'll be things announced for nearly every technology team from bixby and smartthings to mobile devices and smart tvs there's lots of information for developers that they will be able to use to create their own products for 2022 and beyond tony morelan 28 34 so really exciting sdc 21 is going to be october 26 eric cloninger 28 39 and if you want to attend, all you have to do is register at developer samsung com/sdc it's free to attend and we would love to see you there tony morelan 28 51 excellent hey, eric, thanks so much for being on the podcast super exciting to be back at it with sdc and i can't i can't wait for it eric cloninger 28 59 oh, absolutely it's really, it's the result of a year's worth of work by hundreds of people and we really want to share it with all the people out there tony morelan 29 10 yeah, it should be a great show right thanks, eric all right eric cloninger 29 13 thank you, tony closing 29 14 looking to start creating for samsung, download the latest tools to code your next app, or get software for designing apps without coding at all sell your apps to the world on the samsung galaxy store check out developer samsung com today and start your journey with samsung tony morelan 29 30 the pow! podcast is brought to you by the samsung developer program produced by tony morelan
tutorials galaxy watch
blogwatch face studio (wfs) is an intuitive graphical tool that provides designers a means to design watch faces for the wear os smartwatch ecosystem without the need for coding. basic information on a watch face is typically presented as text, and watch face studio enables you to customize how the text is displayed. this article introduces three features you can use to enhance the text on your watch face design: tag expressions curved text bitmap fonts you can follow along with the demonstrations in this blog by downloading the sample project. tag expressions tag expressions enable you to create watch face components for which the rotation, placement, and opacity changes based on tag values. the tag values represent watch data, such as the date and time, battery status, sensor and health data, moon phase, and mathematical operations. for example, you can create a watch face that shows the date and time, and a progress bar that fills up each minute. this section describes how to implement this using tag expressions. to implement the dynamic watch face: create a text component. in the "properties" panel, select the text field text box. select the tags button that appears. figure 1: tags button to add the hour text, from the tag list, select [hour_0_11], then select done. figure 2: tags list similarly, to add the minutes text, create a text component with the [min] tag. to implement the progress bar for the seconds display: a. create a progress bar component. b. define its value as the [sec] tag and set its maximum value to 60. create text components for the date-related elements: [day_week_f] (day of the week), [mon_f] (name of the month), and [day_1_31_z] (day of the month). noteyou can also display the weekday and month information as numbers, by using different tags. keep in mind that in watch face studio, sunday is the first day of the week. the following figure shows the progress bar on the watch face after some visual adjustments. figure 3: seconds progress bar on watch face for more examples of tag expression implementation, see the tag expressions code lab for watch face studio. curved text you can place text around a curve by selecting from predefined angular ranges, or by defining a specific start position and distance. you can also easily set the text direction. to place curved text around the top of the watch face: create a text component and define the text you want to display. in the "properties" panel, select apply curved-text. select ok. the curved text settings appear. in the "curving" fields, define the width and height of the circle or oval around which the text is to be placed. the width and height values are in pixels. for this demonstration, set both the width and height to 436. to place the text around the top of the watch face, in the "range" section, select the upper half circle. figure 4: configuring the curved text the following figure shows the curved text on the watch face after some visual adjustments. figure 5: curved text on a watch face noteyou can also implement curved text on complications. bitmap font bitmap fonts enable you to replace information on the watch face, such as digits, symbols, and day of the week, with customized images. use different icons and images in the bitmap font to make your watch face more interesting. to implement icons for the am/pm tag: create a text component. in the "properties" panel, select the text field text box. select [ampm] from the tags list, and select done. figure 6: am/pm tag in the "text appearance" section, select bitmap font. open the "bitmap font setting" dialog. figure 7: bitmap font configuration in the "bitmap font setting" dialog, select the other tab. to add an image for a specific string, select + and browse to the image on your computer. do this for both the "am" and "pm" strings. to close the dialog, select ok. figure 8: adding a bitmap font image the watch face displays the selected images in place of the "am" and "pm" text strings. a watch face can have multiple bitmap fonts. you can add another bitmap font from the dropdown menu and apply different bitmap fonts to different text elements. figure 9: creating another bitmap font notethe sample project contains two bitmap fonts. conclusion watch face studio provides various text options for the watch face. the text customization features described in this blog can help you create an eye-catching watch face. resources for more information about watch face studio, see the watch face studio documentation. you can also visit the samsung developers forums, an active and friendly community where you can ask for and receive help with your application development. the samsung developers site has many resources for developers looking to build for and integrate with samsung devices and services. stay in touch with the latest news by creating a free account and subscribing to our monthly newsletter. visit the marketing resources page for information on promoting and distributing your android apps. to learn more about customizing your watch face, see also the design complications using watch face studio blog.
Most Fowziya Akther Houya
Learn Code Lab
codelabbuild a health app with steps from samsung health and its connected wearables objective create a step counter application for android devices, utilizing the samsung health data sdk to read steps data collected by the samsung health app overview samsung health offers various features to monitor user health data such as their daily step activity with the samsung health data sdk, android applications can easily access collected data, including steps recorded over a specific period or from a certain device you can retrieve steps data collected by samsung health, obtain the total number of steps taken within the day, and the total number of steps per hour, and apply local time filters to refine your queries effectively set up your environment you will need the following android studio latest version recommended java se development kit jdk 17 or later android mobile device compatible with the latest samsung health version sample code here is a sample code for you to start coding in this code lab download it and start your learning experience! health data steps sample code 573 9 kb set up your android device click on the following links to set up your android device enable developer options run apps on a hardware device activate samsung health's developer mode to enable the developer mode in the samsung health app, follow these steps go to settings > about samsung health then, tap the version number quickly 10 times or more if you are successful, the developer mode new button is shown tap developer mode new and choose on now, you can test your app with samsung health notethe samsung health developer mode is only intended for testing or debugging your application it is not for application users start your project in android studio click open to open existing project locate the downloaded android project mysteps from the directory and click ok check gradle settings before using the samsung health data sdk library, certain configurations are necessary these steps are already applied in the sample code provided the samsung-health-data-api-1 0 0b1 aar library is added to the app\libs folder, and included as a dependency in the module-level build gradle file in the same file, the gson library is also added as a dependency dependencies { implementation filetree mapof "dir" to "libs", "include" to listof "* aar" implementation libs gson } next, the kotlin-parcelize plugin is applied plugins { id "kotlin-parcelize" } lastly, the following entries are also added in the gradle > libs version toml file [versions] gson = "2 10 1" parcelize = “1 9 0” [libraries] gson = { module = "com google code gson gson", version ref = "gson" } [plugins] parcelize = { id = “org jetbrains kotlin plugin parcelize”, version ref = ”parcelize” } request steps data permissions noteyou can access data from samsung health by obtaining a healthdatastore object using the healthdataservice getstore appcontext method to read data from samsung health, you need to acquire proper permissions from the app user each health data type has its own permission additionally, separate permissions are required for reading and writing operations the user must grant the following permissions in the app steps for read operation steps_goal for read operation when launching the application, it is important to verify if the necessary permissions have already been granted this can be achieved through the library function healthdatastore getgrantedpermissions permissions set<permission> set<permission> go to app > kotlin+java > com samsung health mysteps domain in the arepermissionsgrantedusecase kt file, navigate to the permissions object and create the permissions needed to read the steps and steps goal data from samsung health /**************************************************************************** * [practice 1] create permission set to receive step data * * make permissions set down below contain two permission * com samsung android sdk health data permission permission objects of types * - 'datatypes steps' of 'accesstype read' * - 'datatypes steps_goal of 'accesstype read' ****************************************************************************/ object permissions { //todo 1 val permissions = emptyset<permission> } if the permissions are not granted, invoke an ask-for-permissions view the special function provided by the library is called from mainactivity, where the context is an activity's context val result = healthdatastore requestpermissions permissions, context after invoking the function, the app user sees the following pop-up upon starting the application if the user does not consent to read their steps data, the application displays a message explaining why this authorization is vital for the app to function properly notepermissions can be granted or revoked at any time by tapping the more button on the toolbar and selecting the connect to samsung health tab once the user grants the necessary permissions, you can proceed with retrieving the step data from the healthdatastore retrieve steps data from samsung health understand how to retrieve step goal a step goal is a target number of steps set by an individual to achieve within a day this can be set in the samsung health app by navigating to steps > settings > set target check the readlaststepgoal function in readstepgoalfromtodayusecase kt to know how to retrieve the most recent step goal from samsung health @throws healthdataexception class private suspend fun readlaststepgoal int { val startdate = localdate now val enddate = localdate now plusdays 1 log i tag, "startdate $startdate; enddate $enddate" val readrequest = datatype stepsgoaltype last requestbuilder setlocaldatefilter localdatefilter of startdate, enddate build val result = healthdatastore aggregatedata readrequest var stepgoal = 0 result datalist foreach { data -> log i tag, "step goal ${data value}" log i tag, "data starttime ${data starttime}" log i tag, "data endtime ${data endtime}" data value? let { stepgoal = it } } return stepgoal } the function readlaststepgoal retrieves the most recent step goal from samsung health first, it filters the data by setting the startdate and enddate to the current date and the next day respectively using a localdatefilter next, the function builds a request using the datatype stepsgoaltype last constant to retrieve the most recent value and specifies the date range using the setlocaldatefilter method the request is then executed by calling the aggregatedata function of the healthdatastore once the data is fetched, the function loops through each entry and extracts the step goal value finally, it returns the step goal value as the result collect today's total number of steps to verify if the user reached their daily step goal, get the number of steps taken from midnight until the current time perform this calculation by creating a generic function that calculates the total number of steps within a specified time frame then, set the start time as the beginning of today and the end time as the current timestamp total is an aggregate operation that obtains the sum of steps to achieve this task, use the following healthdatastore getgrantedpermissions permissions set<permission> set containsall elements collection<@unsafevariance e> aggregaterequest it represents a request for an aggregation query over time it is used to run aggregate operations like total and last for healthdatapoint localtimefilter filter with a localdatetime type time interval as a condition the time interval is represented as local date time companion function of starttime localdatetime?, endtime localdatetime? creates a localtimefilter with starttime and endtime aggregaterequest localtimebuilder<t> provides a convenient and safe way to set the fields and create an aggregaterequest setlocaltimefilter localtimefilter localtimefilter sets the local time filter of the request in readstepsfromatimerangeusecase kt, navigate to the function getaggregaterequestbuilder and filter today's steps /*************************************************************************** * [practice 2] - create a read request builder to obtain steps from given * time range * collecting steps from a period of time is an aggregate operation which * sums up all the steps from that period * in this exercise you need to * - create a localtimefilter with starttime and endtime for the * aggregaterequest * - apply the filter to the aggregaterequest * ------------------------------------------------------------------------- * - hint * use localtimefilter of to create a time filter for the request **************************************************************************/ fun getaggregaterequestbuilder starttime localdatetime, endtime localdatetime aggregaterequest<long> { val aggregaterequest = datatype stepstype total requestbuilder build // todo 2 return aggregaterequest } a list of aggregated data is received as a result of the request in this example, it's a single-item list containing the total number of steps taken from the beginning of the day to the present moment with the given code, you can iterate over the list and check if the value of the analyzed aggregateddata element is not null if so, assign it to the stepcount variable however, if the value is empty, the code returns a value of 0, indicating that no steps were recorded val result = healthdatastore aggregatedata aggregaterequest var stepcount = 0l result datalist foreach { aggregateddata -> aggregateddata value? let { stepcount = it } } obtain the number of steps for each hour after setting up the functions to fetch steps data from samsung health and aggregating the data to calculate the total step count, you need to obtain the total number of steps for each hour and visualize the steps the user took during every hour of the day to achieve this, utilize the aggregate operation sum of steps , but this time incorporate additional filtering grouping by hour aggregaterequest it represents a request for an aggregation query over time it is used to run aggregate operations like total and last on healthdatapoint localtimefilter filter with a localdatetime type time interval as a condition the time interval is represented as local date time companion function of starttime localdatetime?, endtime localdatetime? creates a localtimefilter with starttime and endtime localtimegroup grouped time interval with a pair of localtimegroupunit and multiplier this means that the grouping is applied to intervals as much as multiplier in local date and time companion function of timegroupunit localtimegroupunit, multiplier int creates a localtimegroup with the given timegroupunit and multiplier localtimebuilder<t> provides a convenient and safe way to set the fields and create an aggregaterequest setlocaltimefilterwithgroup localtimefilter localtimefilter?, localtimegroup localtimegroup? sets the local time filter with the local time group of the request in readgroupedstepsbytimerangeusecase kt, navigate to the getaggregaterequestbuilder function obtain the total number of steps from every hour by creating two variables one to specify the time range using localtimefilter of and another to define the grouping using localtimegroup of by combining these variables, you can set an aggregate request that retrieves the desired data /************************************************************************ * [practice 3] - create an aggregate request for steps from given period * of time * for this, datatype steps grouped by hour is needed * in this exercise you need to * - create an aggregate request, with grouping and time filters, * for filters' parameters use the method's arguments * - return the request * ---------------------------------------------------------------------- * - hint * use setlocaltimefilterwithgroup function to apply time and grouping * filters to the request builder ***********************************************************************/ fun getaggregaterequestbuilder startdatetime localdatetime, enddatetime localdatetime, localtimegroupunit localtimegroupunit, multiplier int aggregaterequest<long> { val aggregaterequest = datatype stepstype total requestbuilder build // todo 3 return aggregaterequest } to apply local time filtering with the given group, use the localtimefilter and localtimegroup classes the localtimegroup consists of a localtimegroupunit, which in this case is hourly, and a multiplier you can also group by other time periods such as daily, weekly, monthly, minutely, and yearly since you want data from every hour period, use a multiplier value of 1 the returned data from the request is a list, where each item represents a grouped value healthdatastore only returns values for periods when the step count is greater than zero the code below shows that by iterating over the returned datalist and adding non-null groupeddata to the output steplist, you can obtain the aggregated value of steps for each hour of the day val result = healthdatastore aggregatedata aggregaterequest val steplist arraylist<groupeddata> = arraylist result datalist foreach { aggregateddata -> var stepcount = 0l aggregateddata value? let { stepcount = it } val starttime = aggregateddata starttime atzone zoneid systemdefault val groupeddata = groupeddata stepcount, starttime tolocaldatetime steplist add groupeddata } noteevery usage of samsung health data sdk might throw a healthdataexception such exceptions are thrown from every backend function up the call stack and handled in viewmodel the healthdataexception has four possible subclasses an example is resolvableplatformexception, which means it can be automatically resolved by invoking resolvableplatformexception resolve activitycontext the reason for such an exception is, for instance, when samsung health app is not installed on the device resolving it results in opening samsung health page in the app store run unit tests for your convenience, an additional unit tests package is provided this package lets you verify your code changes even without using a physical device right-click on com samsung health mysteps test and select run 'tests in 'com samsung health mysteps' if you completed all the tasks correctly, you can see that all the unit tests passed successfully run the app after building the apk, you can run the app on a connected device to read your steps data once the app starts, allow all permissions to read steps data from samsung health and tap done afterwards, the app's main screen appears, displaying the daily summary of steps taken, target, and steps by hour swipe down to sync the latest data from samsung health you can scroll down to steps by hour to see the hourly breakdown you're done! congratulations! you have successfully achieved the goal of this code lab now, you can create a mobile health app that reads samsung health steps count data by yourself! if you are having trouble, you may download this file health data steps complete code 573 4 kb to learn more about samsung health, visit developer samsung com/health
FAQ health
docfaq what are the main features of the samsung health sensor sdk? the main features of the samsung health sensor sdk include track raw and processed health sensor data on galaxy watch receive data from multiple health sensors for information about the available trackers, see what data is provided the continuous health tracker types are accelerometer heart rate photoplethysmogram ppg skin temperature continuous tracker types measured sensor data and periodically invokes a tracking event listener this enables the watch’s sensor data to be tracked continuously and provide more granular results while conserving battery life how do i get access to the samsung health sensor sdk? you can download the samsung health sensor sdk on the samsung developer site and develop your application and develop the application with enabling the health platform's developer mode to distribute your application using the samsung health sensor sdk, request for the samsung partner program when your request is reviewed, you receive information about how to access the sdk content for more information, see process does the samsung health sensor sdk work on android phones? no the samsung health sensor sdk supports only galaxy watch4 and later models running wear os powered by samsung it does not support other mobile devices, such as smartphones can supported health tracker types of the samsung health sensor sdk differ depending on the galaxy watch model or wear os version? yes the supported health tracker types can differ depending on the specific galaxy watch model and the watch software version the samsung health sensor sdk provides a capability check api it retrieves which tracker types are available on the user’s watch and can therefore be used by your application can i read data from more than 1 health tracker type simultaneously? yes, depending on the tracker type there are 2 tracker types on-demand tracker type, such as bia body composition and ecg electrocardiogram continuous tracker type, such as accelerometer and heart rate only 1 on-demand tracker type can be used at a time multiple continuous tracker types can be used simultaneously the measure blood oxygen level and heart rate on galaxy watch code lab demonstrates how to implement running on-demand and continuous tracker types is an emulator available for developing applications with the samsung health sensor sdk? no the samsung health sensor sdk doesn't support the emulator development with the sdk requires the galaxy watch device can i detect when users take the galaxy watch off their wrist? yes, depending on the tracker for the heart rate, spo2, bia body composition , and sweat loss trackers, you can use the samsung health sensor sdk to monitor the status field with the update listener for example, a heart rate status value of “-3” means that the wearable is not being worn for information about other status values and trackers, refer to the api reference alternatively, you can check the sensor type_low_latency_offbody_detect value for more information, see heart rate tracking with the off-body sensor does the samsung health sensor sdk receive its data through samsung health? no the samsung health sensor sdk does not share data with samsung health health services also provides heart rate tracking how is heart rate tracking with the samsung health sensor sdk different? the samsung health sensor sdk provides heart rate data tracking with ibi inter-beat interval , which can be used to calculate hrv heart rate variability this information can be used for more detailed analysis the android sensor manager also provides accelerometer tracking how is accelerometer tracking with the samsung health sensor sdk different? the accelerometer tracking provided by the samsung health sensor sdk records data samples with 25hz resolution continuously the sdk gathers sensor data in an application processor without waking up the cpu and sends an event at specific periods to a watch application this minimizes the watch's battery consumption and enables a watch application to track the user's status for the entire day
We use cookies to improve your experience on our website and to show you relevant advertising. Manage you settings for our cookies below.
These cookies are essential as they enable you to move around the website. This category cannot be disabled.
These cookies collect information about how you use our website. for example which pages you visit most often. All information these cookies collect is used to improve how the website works.
These cookies allow our website to remember choices you make (such as your user name, language or the region your are in) and tailor the website to provide enhanced features and content for you.
These cookies gather information about your browser habits. They remember that you've visited our website and share this information with other organizations such as advertisers.
You have successfully updated your cookie preferences.