rich:dataList vertically ordered between 2 columns

Question

I have a dataGrid with 2 columns and a panelGrid inside it that shows the data correctly, but it fills both columns before changing row. I need it to fill first column, with half of list content and only then go to second column and fill it with rest. It is a static list with an even number right now, but it would be best if it could be done with a dynamic sized list with possible odd total number of values. There is an answer here in SO that shows that asp has a repeatcolumn tag that (if i understood correctly) does what i need. Is there a way to do that using richfaces in jsf?

<fieldset>
  <legend>Select topics:</legend>

      <rich:dataGrid value="#{registerForm.topics}"
         var="topic"
         columns="2">

        <h:panelGrid columns="2" width="430px"
           columnClasses="checkTopic,labelTopic" border="0">
              <h:selectBooleanCheckbox id="checkTopic" 
                  align="left" 
                  value="#{registerForm.SelectedTopic}"
                  disabled="#{not registerForm.ActiveRegister}"/> 
                     <h:outputLabel value="#{topic.description}" 
                            for="checkTopic" />
        </h:panelGrid>                                         
      </rich:dataGrid>
                   
   <h:panelGroup rendered="#{empty registerForm.topics}"
       style="color: red;">
             No topics registered.
   </h:panelGroup>

</fieldset

I think I should use ui:repeat, but cant figure out how. I tried using dataList and dividing the list in 2 parts and each shown in a separed row, but didnt look good, also the code feels overcomplicated than it should be.

Also this question is the same as mine, but the answer doesnt correspond exctly to what is needed and i cant comment because 50 reputation.

I need:
Value1 Value3
Value2 Value4

With the code I have(and the answer) the result is:
Value1 Value2
Value3 Value4

Answer 1

Well you can't change the direction of the items, but you can reorder the list so instead of [1,2,3,4,5] you'll have [1,4,2,5,3].

Alternatively you could use the rendering index (rowKeyVar) and have your bean do the math figuring out what item should be displayed (essentially ignoring the list you're passing to the component).

Answer 2

Solved the issue using two DataTables and the "first" attribute. Had to create "getLines" class in backend, that returns listsize/2 (roundup), because I couddnt figure out how to do it in front end (but plan on doing).

        <fieldset>
            <legend>Select topic:</legend>
            <h:panelGrid id="topicspanel" columnClasses="topicscol,topicscol" columns="2" border="0">

                <rich:dataTable value="#{registerForm.topics}"
                    var="topic" columns="1" rows="#{registerForm.lines}"
                    border="0" id="table1">
                    <rich:column>
                        <h:panelGrid columns="2" width="430px"
                            columnClasses="checkTopic,labelTopic" border="0">
                            <h:selectBooleanCheckbox id="checkTopicCol1" align="left"
                                value="#{registerForm.selectedTopic}"
                                disabled="#{not registerForm.activeRegisters}" />
                            <h:outputLabel value="#{topic.name}"
                                for="checkTopicCol1" />
                        </h:panelGrid>
                    </rich:column>
                </rich:dataTable>

                <rich:dataTable value="#{registerForm.topics}"
                    var="topic" columns="1" rows="#{registerForm.lines}"
                    border="0" id="table2" first="#{registerForm.lines}"
                    align="right">
                    <rich:column>
                        <h:panelGrid columns="2" width="430px"
                            columnClasses="checkTopic,labelTopic" border="0">
                            <h:selectBooleanCheckbox id="checkTopicCol2" align="left"
                                value="#{registerForm.selectedTopic}"
                                disabled="#{not registerForm.activeRegisters}" />
                            <h:outputLabel value="#{topic.name}" for="checkTopicCol2" />
                        </h:panelGrid>
                    </rich:column>
                </rich:dataTable>

            </h:panelGrid>