Help! Some question about datafield layout

Former Member over 4 years ago

I want to develop a datafield similar to Bontrager Light Control, but I don't know how its layout was developed.

I have been researching for a few days, but this datafield can't push or pop view, can't new WatchUi.View in getInitialView(), can't use Button, and WatchUi.BehaviorDelegate just respond onTap event. So I want to know how to develop can be like Bontrager Light Control.

First Q : Why the first page can change a new page when the light is connected ?

Second Q : Is the layout of the second picture a datafield?

Third Q : How create button if the layout of the second picture is datafield ?

Fourth Q : How to respond to click events if the layout of the second picture is datafield ?

Thank you for your help.

Top Replies

jim_m_58 over 4 years ago +1 verified

With a complex DF, you don't need to use layouts, you can use direct DC calls. In the case of the buttons, you can use dc.fillRectangle(x, y, width, height)

and then in onTap(), you look at the screen…

All Replies

0 jim_m_58 over 4 years ago

With a complex DF, you don't need to use layouts, you can use direct DC calls. In the case of the buttons, you can use dc.fillRectangle(x, y, width, height)

and then in onTap(), you look at the screen coordinates of the tap and see if it's within a button or which one

Like this. Screens.button is an array that defoiines where the button was drawn on the screen.

	function onTap(evt) {
		var coord=evt.getCoordinates();
	    if(coord[0]>=Screens.button[0] && coord[0]<=(Screens.button[0]+Screens.button[2])) {
			if(coord[1]>=Screens.button[1] && coord[1]<=(Screens.button[1]+Screens.button[3])) {
				handleButton();
			}
		}
	}

0 Former Member over 4 years ago in reply to jim_m_58

Thank you so much for your reply, I will try

0 Travis.ConnectIQ over 4 years ago

I have not looked at the source code for that app, but I'm 99% sure I know how it works. All of this can be done in a ConnectIQ data field, with or without a layout.

First Q : Why the first page can change a new page when the light is connected ?

I don't fully understand the question.

With a data field, you essentially get one view class (the one that inherits from DataField or SimpleDataField). The system will call onUpdate() on this data field every second.

You can use this to your advantage by changing what is displayed based on context. Your DataField just needs to keep track of the current state, and load the appropriate layout or execute the appropriate display code based on that state.

Second Q : Is the layout of the second picture a datafield?

Yes. Using the technique mentioned above.

Third Q : How create button if the layout of the second picture is datafield ?

If you use layouts, you configure the view to use a layout with a button element defined in it. If you don't use layouts, you draw a rounded rectangle where the button is supposed to be.

Fourth Q : How to respond to click events if the layout of the second picture is datafield ?

If you use a layout, the button element has a behavior attribute that is the name of the function of your delegate that should be called when the button is pressed (doc). If you don't use a layout, you can still use the Button class, or you could do as jim_m_58 has suggested and use an onTap handler to detect the tap yourself.