title: How do you display data in 2 columns and 2 rows for a List which has aggregation Binding?
body: <p>In my view I have a List which has aggregation binding with a property from a model.
  I want this to be displayed in the form of 2 columns and 2 rows. Which control should be used / layout?</p>
  
  <p>In my code the model is set in the controller and has property question and answers where answers is a collection. This model is being binded to the List in the view.</p>
  
  <p>Now I want to display this data in a layout where first two options are in first column and first row and then next 2 options in 2nd row i.e. 2 options with checkboxes per row.</p>
  
  <p>At the moment my code for view, controller and my output looks like follows</p>
  
  <p><strong>App.view.xml</strong></p>
  
  <pre><code>&lt;mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:l="sap.ui.layout" xmlns:f="sap.ui.layout.form" xmlns:core="sap.ui.core"
  displayBlock="true" controllerName="opensap.examples.controller.App" height="100%"&gt;
  &lt;Page title="List Page"&gt;
      &lt;content&gt;
          &lt;List headerText="{myModel&gt;/question}" id="myList" items="{myModel&gt;/answers}"&gt;
              &lt;items&gt;
                  &lt;InputListItem label="{myModel&gt;answerText}"&gt;
                      &lt;CheckBox/&gt;
                  &lt;/InputListItem&gt;
              &lt;/items&gt;
          &lt;/List&gt;
             &lt;Button press="load" text="Click Me"/&gt;
      &lt;/content&gt;
  &lt;/Page&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong>App.controller.js</strong></p>
  
  <pre><code>sap.ui.define([
  "sap/ui/core/mvc/Controller",
  "sap/ui/model/json/JSONModel"], function(Controller, JSONModel) {
  
  var oData = {
      "question": "Which pet do you like from the following?",
      "answers": [{
          "answerText": "Cats"
      }, {
          "answerText": "Rabbits"
      }, {
          "answerText": "Dogs"
      }, {
          "answerText": "Hamsters"
      }]
  };
  
  var oModel;
  
  Controller.extend("opensap.examples.controller.App", {
  
      onInit: function() {
          oModel = new JSONModel();
          oModel.setData(oData);
          this.getView().setModel(oModel, "myModel");
  
  
      },
      load: function() {
          console.log(oModel);
      }
  
  });
  });
  </code></pre>
  
  <p><strong>Output:</strong> <a href="https://i.stack.imgur.com/DJcdK.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DJcdK.png" alt="Output2"></a></p>
  
  <p><strong>What is needed:</strong>  To display Cats and Rabbits answers one one row and Dogs and hamsters on next one i.e. 2 items with checkboxes on one row and so on.</p>
  
  <p>Which control should one use for this? I need a control with aggregation binding.</p>