Thread Tools Display Modes
03/21/16, 08:50 AM   #1
SiSaSyco
AddOn Author - Click to view addons
Join Date: Nov 2014
Posts: 8
Layout of List with variable content

Hi!
I want some content to be displayed in new tab of guild window. It should contain a variable amount of rows that for them self may contain one or more rows. I can place controls with enough height to display a possible amount of data satically but what I want is one row placed after the other no matter what height they have. Is this possible and if it is - how would I do it? Can someone point me to a appropriate recource, or give some tipps?
Second I would like the Window to get scollable when the list gets longer than height of this window. Perhaps it will already scroll, never tried it ...
Thx in advance
  Reply With Quote
03/21/16, 10:02 AM   #2
Ayantir
 
Ayantir's Avatar
AddOn Author - Click to view addons
Join Date: Jul 2014
Posts: 1,019
The best is to use the legacy ZO functions :

Your XML should look like this :


Lua Code:
  1. <TopLevelControl name="Scene_KC_Menu_Spells" inherits="ZO_RightPanelFootPrint" hidden="true">
  2.             <Controls>
  3.                
  4.                 <Control name="$(parent)Headers">
  5.                     <Dimensions x="600" y="32" />
  6.                     <Anchor point="TOPLEFT" relativeTo="$(parent)" relativePoint="TOPLEFT" offsetX="300" offsetY="50"/>
  7.                     <Controls>
  8.                    
  9.                         <Control name="$(parent)AbilityName" inherits="ZO_SortHeader">
  10.                             <OnInitialized>
  11.                                 ZO_SortHeader_Initialize(self, "Ability Name", "abilityname", ZO_SORT_ORDER_DOWN, TEXT_ALIGN_LEFT, "ZoFontGameLargeBold")
  12.                             </OnInitialized>
  13.                             <Anchor point="TOPLEFT" relativeTo="$(parent)" />
  14.                             <Dimensions x="250" y="32" />
  15.                         </Control>
  16.                        
  17.                         <Control name="$(parent)KillingBlows" inherits="ZO_SortHeader">
  18.                             <OnInitialized>
  19.                                 ZO_SortHeader_Initialize(self, "Killing Blows", "killingblows", ZO_SORT_ORDER_DOWN, TEXT_ALIGN_LEFT, "ZoFontGameLargeBold")
  20.                             </OnInitialized>
  21.                             <Anchor point="TOPLEFT" relativeTo="$(parent)AbilityName" relativePoint="TOPRIGHT"/>
  22.                             <Dimensions x="150" y="32" />
  23.                         </Control>
  24.                        
  25.                         <Control name="$(parent)AvgHit" inherits="ZO_SortHeader">
  26.                             <OnInitialized>
  27.                                 ZO_SortHeader_Initialize(self, "AvgHit", "avghit", ZO_SORT_ORDER_DOWN, TEXT_ALIGN_LEFT, "ZoFontGameLargeBold")
  28.                             </OnInitialized>
  29.                             <Anchor point="TOPLEFT" relativeTo="$(parent)KillingBlows" relativePoint="TOPRIGHT"/>
  30.                             <Dimensions x="100" y="32" />
  31.                         </Control>
  32.                        
  33.                         <Control name="$(parent)MaxHit" inherits="ZO_SortHeader">
  34.                             <OnInitialized>
  35.                                 ZO_SortHeader_Initialize(self, "MaxHit", "maxhit", ZO_SORT_ORDER_DOWN, TEXT_ALIGN_LEFT, "ZoFontGameLargeBold")
  36.                             </OnInitialized>
  37.                             <Anchor point="TOPLEFT" relativeTo="$(parent)AvgHit" relativePoint="TOPRIGHT"/>
  38.                             <Dimensions x="100" y="32" />
  39.                         </Control>
  40.                        
  41.                     </Controls>
  42.                 </Control>
  43.                
  44.                 <Control name="$(parent)List" inherits="ZO_ScrollList">
  45.                     <Dimensions x="600" y="575" />
  46.                     <Anchor point="TOPLEFT" relativeTo="$(parent)Headers" relativePoint="TOPLEFT" offsetX="0" offsetY="40" />
  47.                 </Control>
  48.                
  49.             </Controls>
  50.         </TopLevelControl>


This is a list with 5 columns, sortable, scrollable.


Then, in LUA :

- Use LibMainMenu-2 from Votan Potion Maker addon (We should merge the v1 and v2 a day...) to add a tab.
- Build it.

- Init your tab in OnAddonLoaded() func.

Lua Code:
  1. function killingBlowsList:New(control)
  2.    
  3.     ZO_SortFilterList.InitializeSortFilterList(self, control)
  4.    
  5.     local sorterKeys =
  6.     {
  7.         ["abilityname"] = {tiebreaker = "killingblows"},
  8.         ["killingblows"] = {isNumeric = true}, -- the default column.
  9.         ["avghit"] = {tiebreaker = "killingblows"},
  10.         ["maxhit"] = {tiebreaker = "killingblows"},
  11.     }
  12.    
  13.     self.masterList = {}
  14.     ZO_ScrollList_AddDataType(self.list, 1, "KillCounterKillingBlowRowTemplate", 32, function(control, data) self:SetupEntry(control, data) end)
  15.     ZO_ScrollList_EnableHighlight(self.list, "ZO_ThinListHighlight")
  16.     self.currentSortKey = "killingblows"
  17.     self.sortFunction = function(listEntry1, listEntry2) return ZO_TableOrderingFunction(listEntry1.data, listEntry2.data, self.currentSortKey, sorterKeys, self.currentSortOrder) end
  18.     self:SetAlternateRowBackgrounds(true)
  19.    
  20.     return self
  21.    
  22. end
  23.  
  24. function killingBlowsList:SetupEntry(control, data)
  25.    
  26.     control.data = data
  27.     control.abilityname = GetControl(control, "AbilityName")
  28.     control.killingblows = GetControl(control, "KillingBlows")
  29.     control.avghit = GetControl(control, "AvgHit")
  30.     control.maxhit = GetControl(control, "MaxHit")
  31.    
  32.     -- You can reformat how ever you want.
  33.  
  34.     control.abilityname:SetText(data.abilityname)
  35.     control.killingblows:SetText(data.killingblows)
  36.     control.avghit:SetText(data.avghit)
  37.     control.maxhit:SetText(data.maxhit)
  38.    
  39.     ZO_SortFilterList.SetupRow(self, control, data)
  40.    
  41. end
  42.  
  43. function killingBlowsList:BuildMasterList()
  44.     self.masterList = {}
  45.     local killingBlows = db.KillingBlowList -- My SV
  46.     if killingBlows then
  47.         for k, v in ipairs(killingBlows) do
  48.             local data = v
  49.             table.insert(self.masterList, data)
  50.         end
  51.     end
  52.    
  53. end
  54.  
  55. function killingBlowsList:SortScrollList()
  56.     local scrollData = ZO_ScrollList_GetDataList(self.list)
  57.     table.sort(scrollData, self.sortFunction)
  58. end
  59.  
  60. function killingBlowsList:FilterScrollList()
  61.     local scrollData = ZO_ScrollList_GetDataList(self.list)
  62.     ZO_ClearNumericallyIndexedTable(scrollData)
  63.  
  64.     for i = 1, #self.masterList do
  65.         local data = self.masterList[i]
  66.         table.insert(scrollData, ZO_ScrollList_CreateDataEntry(1, data))
  67.     end
  68. end
  69.  
  70. function KillCounter_HoverRowOfKillingBlows(control)
  71.     killingBlowsList:Row_OnMouseEnter(control)
  72. end
  73.  
  74. function KillCounter_ExitRowOfKillingBlows(control)
  75.     killingBlowsList:Row_OnMouseExit(control)
  76. end
  77.  
  78.  
  79.  
  80.  
  81. local function OnAddonLoaded()
  82.  
  83.     -- things includeing the init of the tab.
  84.  
  85.     killingBlowData = killingBlowsList:New(Scene_KC_Menu_Spells)
  86.     killingBlowData:RefreshData()
  87.     cleanSortListForDB("KillingBlowList") -- this func must remove the dataEntry recursive array if your list will go in SavedVars



An exemple of what it does ( It's not finished , I know ) :

  Reply With Quote
03/21/16, 11:00 AM   #3
SiSaSyco
AddOn Author - Click to view addons
Join Date: Nov 2014
Posts: 8
Hey that was quick reply
It won't be neccessary to have sortable Columns, well perhaps no need for columns at all. It looks like this:



Well it could have a column for the first checkbox, then one for title of event and list of attendees (which may wrap to more lines depending on how many people sign in) and one column for the icons on the right.
I will take a closer look at it soon when having more time.

thank you very much!
  Reply With Quote
04/09/16, 09:05 AM   #4
SiSaSyco
AddOn Author - Click to view addons
Join Date: Nov 2014
Posts: 8
Want to say thank you again for your help.

This thread was more likely the functionality i was looking for. Now i learned that i can anchor one element after the other instead of anchoring all relative to the main control!

Next thing will be to get the list scrolling when too long ...
  Reply With Quote

ESOUI » Developer Discussions » General Authoring Discussion » Layout of List with variable content


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off