UIImageView border-radius

Question

I'm trying to style a UIImageView using pixate 2.0.1.

---

Without styling the image looks like this:

---

After applying the style bellow I get this output:

---

.image-photo{
   border: 1px solid #0c0;
   border-radius: 45px;
}

Answer 1

Even though the documentation says you can apply border-radius and other border effects to UIImageView, I don't think you really can without losing your image.

I recommend placing a UIView there, assigning it a styleClass and then putting your UIImageView inside it. You can then reliably apply styles to the UIView and get the background and border effects you want around the image.

Update

There is also an issue with your CSS syntax. Pixate doesn't support the shorthand border notation. You have to write it like this:

.image-photo{
  border-width:1px;
  border-color:#0c0;
  border-style:solid;
  border-radius:45px;
}

Again, this has to go on a UIView that contains the UIImageView.

Answer 2

You need set your image via CSS. If you want to do it in code, then you can use the styleCSS property.