Screen orientation and element-relative swiping tutorial

This is reposted from the appium-discuss google group at Jonah’s request, slightly modified to make more sense out of context, and with a simple code snippet. All examples are in java/junit terminology, but they should be usable in your language of choice with a bit of translating.

First, the AppiumDriver has a getOrientation() method that will return a ScreenOrientation object. The ScreenOrientation object has a value() method that returns either “portrait” or “landscape”. So you can pretty easily tell what your device’s current orientation is by calling driver.getOrientation().value().

You should also be able to call driver.rotate(“LANDSCAPE”) or driver.rotate(“PORTRAIT”) to switch orientations (although I haven’t actually used that functionality in any of my tests to date, so I have no idea if it actually works).

For element-relative swiping, you can locate whatever WebElement you’re trying to interact with, and then call element.getLocation().getX() and element.getLocation().getY() to get the upper-left coordinates of the element. element.getSize().getWidth() and element.getSize().getHeight() will allow you to find the width and height of the element, and from there it’s pretty easy to figure out the x and y for your relative swipes. You will probably want to do a little bit of “safety padding” on those values just to make sure that you’re not clicking on the absolute right or left edge of the element you’re trying to interact with.

So a simple “swipe left-to-right on some WebElement, or right-to-left if we’re in landscape layout” example:

public void swipeElementExample(WebElement el) {
  String orientation = driver.getOrientation().value();

  // get the X coordinate of the upper left corner of the element, then add the element's width to get the rightmost X value of the element
  int leftX = el.getLocation().getX();
  int rightX = leftX + el.getSize().getWidth();

  // get the Y coordinate of the upper left corner of the element, then subtract the height to get the lowest Y value of the element
  int upperY = el.getLocation().getY();
  int lowerY = upperY - el.getSize().getHeight();
  int middleY = (upperY - lowerY) / 2;

  if (orientation.equals("portrait")) {
    // Swipe from just inside the left-middle to just inside the right-middle of the element over 500ms
      driver.swipe(leftX + 5, middleY, rightX - 5, middleY, 500);
  }
  else if (orientation.equals("landscape")) {
    // Swipe from just inside the right-middle to just inside the left-middle of the element over 500ms
    driver.swipe(rightX - 5, middleY, leftX + 5, middleY, 500);
  }
}

Not crazy complex, and not particularly efficient, but it should be enough to get you started.

-Hank

5 Likes

hi
How can i draw a rectangle like figure with one touch action only
Thanks

using ruby.

First I tried:

Appium::TouchAction.press(x:70,y:10).move_to(x:200,y:10).move_to(x:200,y:200).move_to(x:70,y:200).move_to(x:70,y:10).release.perform

But dont know why it was using relatives coordinates instead of direct ones. So what works for me is

Appium::TouchAction.press(x:70,y:10).move_to(x:130,y:0).move_to(x:0,y:200).move_to(x:-130,y:0).move_to(x:0,y:-200).release.perform

This is doing a rectangle for me.

Thanks for the reply… I solved this but not able to draw a circle using the same …? Do we have some capability to draw circle figure using touchaction

Thanks,

Check this:

Hi @Hank,

Thank you for the above information.
But I am having little trouble using above commands for a webview.
When I try to locate element location, below error comes up:
Exception screenshot:unknown error: cannot activate web view
(Session info: chrome=33.0.0.0)

Could you please suggest any workaround for getting element location when context is webview?

Thanks,
Sujata

When I use your suggestion for getOrientation().value() I get the following error:

org.openqa.selenium.WebDriverException: Unexpected orientation returned: unknown

Any idea on what may be causing this?

Yes, it seems Appium returns “Unexpected orientation” for 90 deg (counter clockwise) or 180 degs rotations. Only available orientations are portrait or 90 deg clockwise.

can you guide me with swipe() method parameter to open drawer?
as I do not want to click on drawer button while testing!

I’d use just a swipe(5, 500, 500, 500, 250) - (Swipe from 5, 500 to 500, 500 over 250ms) to open the drawer, and then you can use element-relative swiping to close it. You can randomize things if you want to get fancy, but that should let you get started.

1 Like