We use essential cookies for the website to function, as well as analytics cookies for analyzing and creating statistics of the website performance. To agree to the use of analytics cookies, click "Accept All". You can manage your preferences at any time by clicking "Cookie Settings" on the footer. More Information.

Only Essential Cookies
Accept All
Content DistributionDevelopment GuideDynamic EngineCreative AnimationsGravity Sensing

Gravity Sensing

Function

This animation allows users to change the view by panning or tilting their phones. An example is the theme Ben Granden. You can search for it in HUAWEI Themes to experience the effect.

Demo Video

Materials

Some materials used in the demo video:

XML Specifications

Collapse
Word wrap
Dark theme
Copy code
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <Lockscreen version="1" frameRate="60" displayDesktop="true" screenWidth="1080">
  3. <!-- Acceleration sensor, visible variable-->
  4. <VariableBinders>
  5. <SensorBinder type="accelerometer">
  6. <Variable name="x_1" index="0"/>
  7. <Variable name="y_1" index="1"/>
  8. </SensorBinder>
  9. </VariableBinders>
  10. <!-- The star background references the X-axis direction of the acceleration sensor. That is, the star background changes when the user rotates the mobile phone left or right.-->
  11. <Image x="#screen_width/2-(#x_1)*30" y="#screen_height/2" align="center" alignV="center" src="xx.jpg" visibility="eq(#dt,1)"/>
  12. <!-- The small planet references the X-axis and Y-axis directions of the acceleration sensor. That is, the small planet changes when the user rotates the mobile phone up, down, left, or right.-->
  13. <Image x="#screen_width/2+(#x_1)*20" y="#screen_height/2-(#y_1)*10" align="center" alignV="center" src="xxq01.png" visibility="eq(#dt,1)">
  14. <SizeAnimation>
  15. <Size w="1152" h="1920" time="0"/>
  16. <Size w="1440" h="2400" time="900"/>
  17. <Size w="1440" h="2400" time="15000"/>
  18. </SizeAnimation>
  19. </Image>
  20. <Image x="#screen_width/2+(#x_1)*10" y="#screen_height/2-(#y_1)*5" align="center" alignV="center" src="xxq02.png" visibility="eq(#dt,1)">
  21. <SizeAnimation>
  22. <Size w="1152" h="1920" time="0"/>
  23. <Size w="1440" h="2400" time="900"/>
  24. <Size w="1440" h="2400" time="15000"/>
  25. </SizeAnimation>
  26. </Image>
  27. <!-- Slide up to unlock the screen.-->
  28. <Button x="0" y="0" w="#screen_width" h="#screen_height" visibility="eq(#stapp,1)">
  29. <Triggers>
  30. <Trigger action="up">
  31. <ExternCommand command="unlock" condition="gt(#touch_begin_y-#touch_y,260)"/>
  32. </Trigger>
  33. </Triggers>
  34. </Button>
  35. </Lockscreen>
Search in Distribute Content
Enter a keyword.