Эта страница является
переводом страницы
Blur effect. Перевод выполнен на 100%.
Blur effect
Blur effect is a visual effect that creates blurring in required parts of an interface.
For the effect to work correctly use the latest version of the studio
The blur effect is well-known thanks to photoshop and users of gdgets by Apple. We've realized this function. Now inactive interface can be separated with blurring.
The blur effect can be set constantly for a graphical item (button) or it can be made dynamic by means of the script. For example, when a button is pressed blurred items appear above an active page with graphical items. A separate item on a page can also be blurred (a button, a trigger, a level, etc.).
The examples contain two projects. One of them is made with the help of graphical and script method to create the blur effect. The other, on the basis of iOS interface, show how the blur effect works in a ready interfcae when "Unlock" button is pressed.
Setting Parameters of Blur Effect
The blur effect has the following parameters:
- BlurType - a type of blur, it can be "Default", or "Background".
- Default - blurring the image of an item. The whole image on a button is blurred, the background can't be seen.
- Background - a type of blur effect that uses the background under a graphical item as the basis, puts it on an item and blurs it.
- BlurDepth - the depth of effect from 0 to 100. When the depth is 0 there is no blur effect at all, when the depth is 100 an item is maximally blurred.
The blur effect can be used in the studio in two ways:
- In State settings of a graphical item in iRidium studio;
- Setting the blur effect Java script.
1. Setting the blur effect in iRidium studio
All settings of the blur effect are available in the State settings of a graphical item/page/popup. Setting the effect requires a couple of uncomplicated actions.
1. Create a graphical item in a project and go to the settings of its State. Select BlurType parameter.
- Default - blurring the image of an item. The whole image on a button is blurred, the background can't be seen.
- Background - a type of blur effect that uses the background under a graphical item as the basis, puts it on an item and blurs it.
2. Select the depth of the effect from 0 to 100 in the BlurDepth parameter.
Select the depth of the blur effect in the range from 1 to 100. If 0 is selected, there is no blur at all. If the "Background" type of blur is selected and the depth is selected as 0, the image on an item is not blurred and stays visible.
2. Setting the blur effect Java script
Select the BlurType the following way:
.BlurType = IR.BLUR_DEFAULT - it assigns to an object the "Default" type of blur effect
IR.GetPage("Page 1").GetState(0).BlurType = IR.BLUR_DEFAULT; //"Default" type of the blur effect
IR.GetPage("Page 1").GetState(0).BlurDepth = 100;
.BlurType = IR.BLUR_BACKGROUND - it assigns to an object the "Background" type of blur effect
IR.GetPopup("Popup 7").GetState(0).BlurType = IR.BLUR_BACKGROUND; //"Background" type of the blur effect
IR.GetPopup("Popup 7").GetState(0).BlurDepth = 15; // depth of effect
BlurDepth - depth of effect
.BlurDepth = 15 - the depth is set in a ranger from 0 to 100
IR.GetPopup("Popup 7").GetState(0).BlurDepth = 15;