DISTRIBUTION OF TIZEN-BASED WATCH APPS HAS BEEN DISCONTINUED

Set as Button

The Set as Button feature enables interaction with your watch face by allowing the user to tap a component to change images, open different apps, change time zone, change temperature units or update weather data.


Step 1: Click on a component To make a button, select a component.

Step 2: Select Set as Button Select Set as Button from the Properties tab. If the Set as Button option is disabled, that means Set as Button is not supported by this component.




Step 3: Edit the button properties There are two tabs under Properties: Normal and Action. The Normal tab is the default found in each component. The Action tab is used for the Set as Button feature. You can use this tab to configure how a button interacts, as well as its action.

Step 4: Set Interaction Select Interaction from the dropdown. In this example, the button works by tapping the component twice.

Step 5: Set Action behavior There are different kinds of Action behavior for different components. Actions depend on the type of component. In this example, Change Image is selected.



Action Behavior

All components do not support the same button action behavior, so it is necessary to know which component supports which button action. Galaxy Watch Studio supports the following button action behavior:

  • None: Default behavior. No action occurs. All components support this behavior.
  • Open App: Five components support the Open App action: Background, Watch Hand, Digital Clock, Image, and Text. These three types of apps can be opened:


Preloaded App: All Galaxy Watches include a list of factory-installed apps. You can find this list from the Open App tab. Select any app to open after tapping on the button.

Custom: Add your own Tizen Wearable App ID or the App ID of any wearable app from the Galaxy Store. However, that app must be installed on the user’s watch; otherwise, the button won’t work. For your app: The App ID can be found in the config.xml file of your Tizen project. Any other app from Galaxy Store: Contact the app developer and request the App ID or use the App Switcher.

App Switcher: This option is enabled when the Interaction is set as Double Tap. It allows a user to choose any app that is installed on his or her watch by double-tapping on the component at any time. After choosing the app, the user can open that app by single-tapping and change the app by double-tapping.



To get an idea of how to use this feature, see How To: Create A Tap Reveal Button To Show Hidden Data.

  • Change Image: Change the image of a component by single- or double-tapping it. This option can be used for the following components: Background, Watch Hand, and Image.

  • Time Zone Selector: This action is available only for the Digital Clock component when Interaction is set to Tap. This action is not available on double-tap. From the dropdown, you can choose any default time zone along with Sync with Device.

Note that if you set the action to Time Zone Selector, then the Normal > Time zone option becomes disabled. So, you have to set the default time zone in the Normal Tab before setting the action to Time Zone Selector. See the Time Travel Is Easy With A Time Zone Selector Button blog for more information about using this feature.

  • Update Weather Data: This button action allows a user to update all types of weather data on a watch face, whenever she or he wants, by tapping the button. This action is available for all types of weather text: Weather Type, Temperature, Humidity, City Name (Weather), and Last Update Time (Weather).
  • Change Temperature Unit: The user can choose any unit for the temperature data. This is only available for the Temperature-type Text component. The Use Galaxy Watch Designer to Change the Weather blog has further information on this topic.

Tap Area of Button

When you make a custom image for a button, consider the tap area. You can set any image as a button, but the tap area of that button is always rectangular or square. After setting an image as a button, the entire area inside the red dotted lines is the part of that button (see Figures 1 and 2).

Figure 1

Figure 2



Layer Concepts and Limitations

Galaxy Watch Studio supports the concept of layers, which means a component on a higher layer takes precedence over components on lower layers. When you add a new component, it will always be added as the top layer. You can change the order of layers if you want. By default, the Background component is always the lowest layer, but you can move it to another layer if you desire.

A button action on a higher layer takes precedence over a button action on a lower layer. Let’s assume two components are buttons and the top-layer component covers the lower-layer component. In this case, the button action won't work for the lower-layer component (see Figures 3 and 4):

Figure 3

Figure 4



Three components in Figure 3 are buttons. Component 1 is the top-layer component, which covers component 2 and part of component 3. Component 3 can be divided into two areas: Area 1, which is covered by component 1, and Area 2, which is not covered by any other component.

If you tap component 1, the button action will work according to component 1. The button action won’t work on component 2, as it is fully covered by component 1. The button action of component 3 won’t work on Area 1, as this part is covered. But if you tap on Area 2, it will work according to component 3.


Watch Hand Limitations

When you import any image as a watch hand, this image traverses a 360-degree area; therefore, watch hands cover the full 360-degree area. The tap area is the same as other components, which is the area inside the red dotted lines.

Example 1

Let’s assume a lower-layer button is placed inside the watch hand area. This button won't work for the same reason as component 2 (the lower layer) in Figure 3. But if you place this component on a higher layer than the watch hand, then the button action will work. Figure 5 depicts the scenario where all components are buttons. In Figure 5, the black line is the tap area of a component, and the white index area is the covered area of the watch hand.

Figure 5

Component 1 and the Watch Hand:
Suppose component 3 doesn’t exist. The watch hand is on a higher layer than component 1. A watch hand traverses a 360-degree area, so it covers the whole circular area. Component 1 can be divided into two areas: A1 is inside the watch hand’s area, and A2 is the rest of the area of component 1. If you tap on A1, nothing happens. But if you tap on A2, the button action will work. The button action of the watch hand works normally.

Component 3 and the Watch Hand:
Component 3 is on a higher layer than the watch hand. Component 3 can be divided into two parts: A3 and A4. In this case, three scenarios can occur:

  • Tap on component 3 (A3 or A4) when the watch hand is not above component 3. The button action will work according to the action configured for component 3.
  • Tap on the watch hand when it overlaps A3. The button action of the watch hand won’t work, but the button action of component 3 will work, because component 3 is the higher-layer component.
  • Tap on the watch hand when it does not overlap component 3. The button action of the watch hand will work, because this area is not covered by any other component.

Example 2

If you want to set the button action on more than two watch hands, then you should be careful about layering. The diameter of all watch hands shouldn’t be the same if their pivot points are the same. If the diameter is different, then the covered area of the watch hand will be different.

The idea is that a smaller watch hand should be on a higher layer than the larger watch hand. The disjoint area can be a tap area for a larger watch hand. However, if you keep the larger watch hand on top, the smaller watch hand will be covered and can’t be tapped (see Figure 6):

Figure 6

In Figure 6, the hour watch hand is smaller than the minute watch hand. Area 2 is the intersected area of these two hands, and Area 1 is a disjoint area of the minute watch hand.

If the hour watch hand is on the higher layer, Area 2 is the covered area for the hour watch hand. If you tap on the minute watch hand in Area 2, no action occurs. The button action of the minute watch hand will work in Area 1 only.