To Change any CSS style of an element using JQuery, you normally do this.

With a JQuery UI Button, it is a little different since it is not just one element but a group of HTML tags that make up this button.

To do so, simply get the parent of the JQuery object that you retrieved by id.

There may be cases with your code that once you use HTML2Canvas to take a screenshot on certain parts of the web page, the CSS styles of the HTML elements gets messed up.

Remember, HTML2Canvas does not take a screenshot literally but uses the web page’s DOM structure to traverse through the page it is loaded on. It gathers information on all the elements there, which it then uses to build a representation of the page.

It builds a representation of it based on the properties it reads from the DOM.

If your case happens to have a messed up layout after a screenshot is taken, do not worry. You only need to change 1 line of code.

Look for the createWindowClone() function under the Promise block code. There should be a function there that has documentClone.adoptNode().

Thing is, the adoptNode() method adopts a node from another document which means all child nodes and descendants, if any, of the adopted node, are also adopted.

The original node and its descendants are removed from the other document so this is the reason why some cases your CSS may get affected.

The solution to this is to use the alternative method importNode(). Simply change it to:

Changing themes and styles of Android widgets require you to modify its drawable images. For the Spinner widget, I found it necessary to have the height changed because the default is just too fat.

You need to create your own 9 patch images or you can get the existing one in Android‘s and modify it. A quicker way though is to make use of this great article by Kostya Vasilyev on compact Spinner widgets.

There are already 9 patch images for you to use. If you want it to have a different color then you will have to modify it yourself. But at least there is already a thin image ready for you to use.

This is a screenshot taken from his site showing the slim spinners side-by-side with the regular ones in an HTC Hero smartphone.

And these are his 9 patch images.

To use the images in an XML file, place them in a selector XML file like this and use it in the Spinner tag.

There you have it. Now you have slimmer Spinner widgets for your app! Just make sure when you save these images from my post you replace the -9 in the filename to .9 because all 9 patch images should end with .9.png.

Related Posts Plugin for WordPress, Blogger...