Jump to content

Как программно открыть/выбрать панель при layout = accordion

x11

By x11
in Russian

 Share

Recommended Posts

x11 Advanced Member

x11

Posted
Posted

Так как компонента типа "SlideShow" в UniGUI отсутствует, пришлось соорудить своего "франкенштейна" на базе основной панели, где layout = accordion, а внутри лежат несколько дочерних панелей с uniImage.

По некоторым причинам нужно программным способом, т.е. отдельными кнопками (командами) листать дочерние панели с картинками.

Как это можно сделать? Даже не знаю, в какую сторону копать.

Спасибо.

x11 Advanced Member

x11

Posted
  • Author
Posted
1 hour ago, Sherzod said:

На форуме были решения. 

вопрос по теме

http://forums.unigui.com/index.php?/topic/9429-panels-in-a-accordion-layout/&do=findComment&comment=48877

 

а как вместо uname отправить jsname? 

function afterrender(sender, eOpts)
{
    var me=sender;
    me.items.items.forEach(function(item){

        item.addListener('expand', function(){
            ajaxRequest(me, '_expandorcollapse', ['uname='+me.layout.getExpanded()[0].uname]);
        })
    });
}

 

т.к. для кода 

  UniSession.AddJS('Ext.onReady(function () {' + YourPanelJSName + '.expand()});');

требуется JSName

 

Спасибо.

 

x11 Advanced Member

x11

Posted
  • Author
Posted

Все получилось. Спасибо.

 

А еще вопрос, хотя и не совсем по теме: а layout типа accordion можно заставить разворачиваться по горизонтали, а не по вертикали? Т.е. с лева на право.

x11 Advanced Member

x11

Posted
  • Author
Posted

И еще вопрос. можно ли как-то заменить иконки + и - на другие?

А то + и - это добавить/удалить, а не свернуть/развернуть.

Спасибо.

 

Screenshot_6.jpg

Sherzod Advanced Member

Sherzod

Posted
Posted
3 hours ago, x11 said:

И еще вопрос. можно ли как-то заменить иконки + и - на другие?

 Я проверю.

  • Like 1
x11 Advanced Member

x11

Posted
  • Author
Posted

Мне кажется, можно как-то через шрифты fontawesome, там есть шевроны

Screenshot_12.jpg

Screenshot_13.jpg

x11 Advanced Member

x11

Posted
  • Author
Posted
On 4/14/2021 at 11:42 AM, Sherzod said:

На форуме были решения. 

Вопрос по коду 

function afterrender(sender, eOpts)
{
    var me=sender;
    me.items.items.forEach(function(item){

        item.addListener('expand', function(){
            ajaxRequest(me, '_expandorcollapse', ['uname='+me.layout.getExpanded()[0].uname]);
        })
    });
}

 

а как быть, если панели добавляются в runtime?

Пользователь нажимает "Добавить картинки", выбирает несколько и картинки грузятся на сервер и по количеству картинок программно создается такое же количество дочерних панелей с картинками.

т.е. как ко вновь добавленным дочерним панелям прикрутить что-то вроде:

  

addListener('expand', function(){
            ajaxRequest(me, '_expandorcollapse', ['uname='+me.layout.getExpanded()[0].uname]);

Спасибо.

x11 Advanced Member

x11

Posted
  • Author
Posted

Правильно ли я делаю? 

procedure TfrdParentEditObj.AddImage(const AStream: TStream; const  FileName: string);
...
begin
...
...

pnlImage        := TUniPanelPhotos.Create(pnlPhotos);

pnlImage.JSInterface.JSAddListener('expand',

        'function afterCreate(sender) { ' +
        'var me = sender; ' +
        'me.addListener(''expand'', ' +
        '	function(){ajaxRequest(me, ''_expandorcollapse'', [''uname=''+me.layout.getExpanded()[0].uname])});' +
        '}'

  );
...
...

что-то не так, т.к. не отправляется ajaxRequest

Sherzod Advanced Member

Sherzod

Posted
Posted
7 hours ago, x11 said:

pnlImage.JSInterface.JSAddListener('expand', 'function afterCreate(sender) { ' + 'var me = sender; ' + 'me.addListener(''expand'', ' + ' function(){ajaxRequest(me, ''_expandorcollapse'', [''uname=''+me.layout.getExpanded()[0].uname])});' + '}' );

Попробуйте так: 

  pnlImage.JSInterface.JSAddListener('expand',
        'function (me) { ' +
        '    ajaxRequest(me, ''_expandorcollapse'', [''uname=''+me.layout.getExpanded()[0].uname]);' +
        '}'
  );

 

x11 Advanced Member

x11

Posted
  • Author
Posted

я ж правильно понимаю, что Listener нужно добавлять к дочерним панелям с картинками?

Или нужно добавлять к родительской панели?

 

потому что пока не хочет работать, и ошибок в консоли нет

x11 Advanced Member

x11

Posted
  • Author
Posted

я добавил colsole.log(''123''); 

  pnlImage.JSInterface.JSAddListener('expand',
        'function (me) { ' +
        ' colsole.log(''123'');    ajaxRequest(me, ''_expandorcollapse'', [''uname=''+me.layout.getExpanded()[0].uname]);' +
        '}'
  );

и в консоли ничего нет

вот полный код добавления панелей с картинками: 

type
    TUniPanelPhotos = class(TUniPanel)
    public
      img: TuniImage;
  end;


...
...
...
procedure TfrdParentEditObj.FileUploadMultiCompleted(Sender: TObject; Files: TUniFileInfoArray);
begin
  // process files after all files are uploaded
  for var I := Low(Files) to High(Files) do
    if Assigned(Files[I].Stream) then
      AddImage(Files[I].Stream, Files[I].FileName);
end;


procedure TfrdParentEditObj.AddImage(const AStream: TStream; const  FileName: string);
Var
 ImgData: TImageData;
 sLocalPath, ADest, sURL: string;
 img: TUniImage;
 pnlImage: TUniPanelPhotos;
begin
// добавить фото к объекту

  sLocalPath := GetPhotoDirOfObject(fID.ToString, fCurrSuperType);
  if not DirectoryExists(sLocalPath) then
    ForceDirectories(sLocalPath);

  ADest := IncludeTrailingPathDelimiter(sLocalPath) + filename;
  Imaging.InitImage(ImgData);
  Imaging.LoadImageFromStream(AStream, ImgData);
  Imaging.SaveImageToFile(ADest, ImgData);


  //панель, на которой будет лежать картинка
  pnlImage        := TUniPanelPhotos.Create(pnlPhotos);
  pnlImage.Name   := constPnlPhotoImageName + (pnlPhotos.ControlCount + 1).ToString;
  pnlImage.Title  := FileName;
  pnlImage.Parent := pnlPhotos;
  pnlImage.JSInterface.JSAddListener('expand',
        'function (me) { ' +
        ' colsole.log(''123'');    ajaxRequest(me, ''_expandorcollapse'', [''uname=''+me.layout.getExpanded()[0].uname]);' +
        '}'
  );

  //картинка, которая будет лежать на панели
  img             := TUniImage.Create(pnlImage);
  pnlImage.img    := img;
  img.Parent      := pnlImage;
  img.LayoutConfig.Width  := 'auto';
  img.LayoutConfig.Height := '100%';

  if TFile.Exists(ADest) then
  begin
    sURL := GetPhotoUrlOfObject(fID.ToString, fCurrSuperType);
    img.Url  := sURL + FileName + GetNoCacheString;
    img.Hint := img.Url;
    pnlImage.Hint := FileName;
    UniSession.AddJS('Ext.onReady(function () {' + pnlImage.JsName + '.expand()});');//раскрываем последнюю добавленную
    fActivePhotoPanelName := pnlImage.Name;
  end;

  Imaging.FreeImage(ImgData);
end;

 

Sherzod Advanced Member

Sherzod

Posted
Posted
5 minutes ago, x11 said:

я ж правильно понимаю, что Listener нужно добавлять к дочерним панелям с картинками?

Или нужно добавлять к родительской панели?

 

потому что пока не хочет работать, и ошибок в консоли нет

Да,

Тогда попробуйте такой код: 

  pnlImage.JSInterface.JSAddListener('afterrender',
    'function (sender, eOpts)'+
    '{                       '+
    '    var me=sender;      '+
    '    me.items.items.forEach(function(item){'+

    '        item.addListener("expand", function(){'+
    '            ajaxRequest(me, "_expandorcollapse", ["uname="+me.layout.getExpanded()[0].uname]);'+
    '        })'+
    '    });   '+
    '}         '
  );

Либо используйте:

ClientEvents

x11 Advanced Member

x11

Posted
  • Author
Posted
4 minutes ago, Sherzod said:

Тогда попробуйте такой код:

нет, не работает

 

4 minutes ago, Sherzod said:

Либо используйте:

ClientEvents

как именно, подскажите, пожалуйста

Sherzod Advanced Member

Sherzod

Posted
Posted
5 minutes ago, x11 said:

как именно, подскажите, пожалуйста

Попробуйте: 

  ...
  pnlImage.ClientEvents.ExtEvents.Values['afterrender'] :=
    'function afterrender(sender, eOpts)'+
    '{                       '+
    '    var me=sender;      '+
    '    me.items.items.forEach(function(item){'+

    '        item.addListener("expand", function(){'+
    '            ajaxRequest(me, "_expandorcollapse", ["uname="+me.layout.getExpanded()[0].uname]);'+
    '        })'+
    '    });   '+
    '}         '

 

x11 Advanced Member

x11

Posted
  • Author
Posted
16 minutes ago, Sherzod said:

Да,

не совсем понял

код "function afterrender(sender, eOpts)'+"

нужно к родительской панели добавлять или к каждой дочерней?

 

x11 Advanced Member

x11

Posted
  • Author
Posted

добавил  colsole.log(''123'');

нет, не работает, никаких сообщений в консоли нет 

procedure TfrdParentEditObj.FileUploadMultiCompleted(Sender: TObject; Files: TUniFileInfoArray);
begin
  inherited;
  // process files after all files are uploaded
  for var I := Low(Files) to High(Files) do
    if Assigned(Files[I].Stream) then
      AddImage(Files[I].Stream, Files[I].FileName);

  pnlPhotos.ClientEvents.ExtEvents.Values['afterrender'] :=
    'function afterrender(sender, eOpts)'+
    '{  colsole.log(''123''); '+
    '    var me=sender;      '+
    '    me.items.items.forEach(function(item){'+

    '        item.addListener("expand", function(){'+
    '            ajaxRequest(me, "_expandorcollapse", ["uname="+me.layout.getExpanded()[0].uname]); colsole.log(''123'');'+
    '        })'+
    '    });   '+
    '}         ';
end;

pnlPhotos - это родительская панель

что еще может быть не так?

x11 Advanced Member

x11

Posted
  • Author
Posted

такое впечатление, что при открытом фрейме, когда загружаешь картинки, код "pnlPhotos.ClientEvents.ExtEvents.Values['afterrender'] :=" в браузер не попадает из бэкэнда

x11 Advanced Member

x11

Posted
  • Author
Posted

pnlPhotos  лежит на фрейме пустая и имя не меняется.

пользователь нажимает Добавить фото, выбирает 1 или несколько и нажимает загрузить

срабатывает код, описанный выше: 

procedure TfrdParentEditObj.FileUploadMultiCompleted(Sender: TObject; Files: TUniFileInfoArray);
begin
  inherited;
  // process files after all files are uploaded
  for var I := Low(Files) to High(Files) do
    if Assigned(Files[I].Stream) then
      AddImage(Files[I].Stream, Files[I].FileName);

//добавляем событие
  pnlPhotos.ClientEvents.ExtEvents.Values['afterrender'] :=
    'function afterrender(sender, eOpts)'+
    '{  colsole.log(''123''); '+
    '    var me=sender;      '+
    '    me.items.items.forEach(function(item){'+

    '        item.addListener("expand", function(){'+
    '            ajaxRequest(me, "_expandorcollapse", ["uname="+me.layout.getExpanded()[0].uname]); colsole.log(''123'');'+
    '        })'+
    '    });   '+
    '}         ';
end;

 

а здесь видно, что имена дочерних панелей генерируются вот так:

pnlImage1,  pnlImage2, pnlImage3

  

//панель, на которой будет лежать картинка
  pnlImage        := TUniPanelPhotos.Create(pnlPhotos);
  pnlImage.Name   := constPnlPhotoImageName + (pnlPhotos.ControlCount + 1).ToString;

 

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...