Ext.ux.Spotlight

[Sherzod]

UX used to provide a spotlight around a specified component/element.

 

1. MainForm.Script ->

var spotlight = Ext.create('Ext.ux.Spotlight', {
    easing: 'easeOut',
    duration: 500
});

spotlight.hideAndInactive = function() {
    this.hide();
    this.active = false;
};

2. CustomCSS ->

.x-spotlight {
    background-color: #ccc;
    z-index: 99999;
    position: absolute;
    top: 0;
    left: 0;
    -moz-opacity: 0.5;
    opacity: .50;
    filter: alpha(opacity=50);
    width: 0;
    height: 0;
    zoom: 1;
    font-size: 0;
}

3. Initialization ->

initialization
  UniAddCSSLibrary('build/packages/ux/classic/classic/resources/ux-all.css', False, [upoFolderJS, upoPlatformDesktop]);
  UniAddJSLibrary('build/packages/ux/classic/ux.js', False, [upoFolderJS, upoPlatformDesktop]);

 

Simple usage ->

Show:

procedure TMainForm.UniButton1Click(Sender: TObject);
begin
  JSInterface.JSCallGlobal('spotlight.show', [UniEdit1.JSId]);
end;

Hide:

procedure TMainForm.UniEdit1Click(Sender: TObject);
begin
  JSInterface.JSCallGlobal('spotlight.hideAndInactive', []);
end;

 

[MSMK]

2 minutes ago, Sherzod said:

UX used to provide a spotlight around a specified component/element.

 

1. MainForm.Script ->

var spotlight = Ext.create('Ext.ux.Spotlight', {
    easing: 'easeOut',
    duration: 500
});

spotlight.hideAndInactive = function() {
    this.hide();
    this.active = false;
};

2. CustomCSS ->

.x-spotlight {
    background-color: #ccc;
    z-index: 99999;
    position: absolute;
    top: 0;
    left: 0;
    -moz-opacity: 0.5;
    opacity: .50;
    filter: alpha(opacity=50);
    width: 0;
    height: 0;
    zoom: 1;
    font-size: 0;
}

3. Initialization ->

initialization
  UniAddCSSLibrary('build/packages/ux/classic/classic/resources/ux-all.css', False, [upoFolderJS, upoPlatformDesktop]);
  UniAddJSLibrary('build/packages/ux/classic/ux.js', False, [upoFolderJS, upoPlatformDesktop]);

 

Simple usage ->

Show:

procedure TMainForm.UniButton1Click(Sender: TObject);
begin
  JSInterface.JSCallGlobal('spotlight.show', [UniEdit1.JSId]);
end;

Hide:

procedure TMainForm.UniEdit1Click(Sender: TObject);
begin
  JSInterface.JSCallGlobal('spotlight.hideAndInactive', []);
end;

 

Добрый день! А можно ли сделать водяные знаки(water mark), используя эту конструкцию? 

[Sherzod]

Добрый день,

Just now, =GGG= said:

А можно ли сделать водяные знаки(water mark), используя эту конструкцию? 

В смысле?

[MSMK]

4 minutes ago, Sherzod said:

Добрый день,

В смысле?

Необходимо сделать водяные знаки на всю форму, надпись с текстлм пользователя, чтоб повторялось по всей форме и была прозрачной. Чтоб в случае скриншота, можно было идентифировать пользователя

[Sherzod]

2 minutes ago, =GGG= said:

Необходимо сделать водяные знаки на всю форму, надпись с текстлм пользователя, чтоб повторялось по всей форме и была прозрачной. Чтоб в случае скриншота, можно было идентифировать пользователя