from: https://github.com/sproutit/samples-todos/raw/master/apps/todos/english.lproj/main_page.js

main_page.design.xml

<?xml version="1.0" encoding="UTF-8" ?>
<design:SC.Page xmlns:design="http://foo.bar" xmlns:attr="http://foo.bar">
  <attr:mainPane>
    <design:SC.MainPane>
      <attr:childViews>
        <design:SC.View mixin="SC.Border" borderStyle="SC.BORDER_BOTTOM">
          <attr:layout top="0" bottom="0" right="0" height="48" />
          <attr:childViews>
            <design:SC.LabelView controlSize="SC.LARGE_CONTROL_SIZE" fontWeight="SC.BOLD_WEIGHT" title="'Todos'">
              <attr:layout centerY="0" height="24" left="8" width="200" />
            </design:SC.LabelView>
            <design:SC.ButtonView title="Add Task">
              <attr:layout centerY="0" height="21" right="8" width="100" />
            </design:SC.ButtonView>
            <design:SC.ScrollView hasHorizontalScroller="NO" backgroundColor="white">
              <attr:layout top="42" bottom="42" left="0" right="0" />
              <attr:contentView>
                <design:SC.ListView contentBinding="'Todos.tasksController.arrangedObjects'"
                        selectionBinding="'Todos.tasksController.selection'"
                        contentValueKey="'description'"
                        contentCheckBoxKey="'isDone'"
                        canReorderContent="YES" />
              </attr:contentView>
            </design:SC.ScrollView>
            <design:SC.View mixin="SC.Border" borderStyle="SC.BORDER_TOP">
              <attr:layout bottom="0" left="0" right="0" height="41" />
              <attr:summaryView>
                <design:labelView textAlign="SC.ALIGN_CENTER" valueBinding="'Todos.tasksController.summary'">
                  <attr:layout centerY="0" height="18" left="20" right="20" />
                </design:labelView>
              </attr:summaryView>
            </design:SC.View>
          </attr:childViews>
        </design:SC.View>
      </attr:childViews>
    </design:SC.MainPane>
  </attr:mainPane>
</design:SC.Page>

main_page.generated.js

SC.Page.design({
     mainPane: SC.MainPane.design({
               childViews: [
                    SC.View.design(SC.Border, {
                         mixin: SC.Border,
                         borderStyle: SC.BORDER_BOTTOM,
                         layout: { top: 0, bottom: 0, right: 0, height: 48 },
                         childViews: [
                              SC.LabelView.design({
                                   controlSize: SC.LARGE_CONTROL_SIZE,
                                   fontWeight: SC.BOLD_WEIGHT,
                                   title: 'Todos',
                                   layout: { centerY: 0, height: 24, left: 8, width: 200 },
                              }),
                              SC.ButtonView.design({
                                   title: Add Task,
                                   layout: { centerY: 0, height: 21, right: 8, width: 100 },
                              }),
                              SC.ScrollView.design({
                                   hasHorizontalScroller: NO,
                                   backgroundColor: white,
                                   layout: { top: 42, bottom: 42, left: 0, right: 0 },
                                   contentView: SC.ListView.design({
                                             contentBinding: 'Todos.tasksController.arrangedObjects',
                                             selectionBinding: 'Todos.tasksController.selection',
                                             contentValueKey: 'description',
                                             contentCheckBoxKey: 'isDone',
                                             canReorderContent: YES,
                                        });
                              }),
                              SC.View.design(SC.Border, {
                                   mixin: SC.Border,
                                   borderStyle: SC.BORDER_TOP,
                                   layout: { bottom: 0, left: 0, right: 0, height: 41 },
                                   summaryView: labelView.design({
                                             textAlign: SC.ALIGN_CENTER,
                                             valueBinding: 'Todos.tasksController.summary',
                                             layout: { centerY: 0, height: 18, left: 20, right: 20 },
                                        });
                              }),
                         ]
                    });
               ]
          });
});

main_page.js

// ==========================================================================
// Project:   Todos - mainPage
// Copyright: ©2009 My Company, Inc.
// ==========================================================================
/*globals Todos */

// This page describes the main user interface for your application.  
Todos.mainPage = SC.Page.design({

  mainPane: SC.MainPane.design({
    childViews: 'topView middleView bottomView'.w(),
    
    topView: SC.View.design(SC.Border, {
      layout: { top: 0, left: 0, right: 0, height: 41 },
      childViews: 'labelView addButton'.w(),
      borderStyle: SC.BORDER_BOTTOM,
      
      labelView: SC.LabelView.design({
        layout: { centerY: 0, height: 24, left: 8, width: 200 },
        controlSize: SC.LARGE_CONTROL_SIZE,
        fontWeight: SC.BOLD_WEIGHT,
        value:   'Todos'
      }),
      
      addButton: SC.ButtonView.design({
        layout: { centerY: 0, height: 21, right: 8, width: 100 },
       title:  "Add Task"
      })
    }),
    
    middleView: SC.ScrollView.design({
      hasHorizontalScroller: NO,
      layout: { top: 42, bottom: 42, left: 0, right: 0 },
      backgroundColor: 'white',

      contentView: SC.ListView.design({
        contentBinding: 'Todos.tasksController.arrangedObjects',
        selectionBinding: 'Todos.tasksController.selection',
        contentValueKey: "description",
        contentCheckboxKey: "isDone",
        canReorderContent: YES
      })
    }),
    
    bottomView: SC.View.design(SC.Border, {
      layout: { bottom: 0, left: 0, right: 0, height: 41 },
      childViews: 'summaryView'.w(),
      borderStyle: SC.BORDER_TOP,
      
      summaryView: SC.LabelView.design({
        layout: { centerY: 0, height: 18, left: 20, right: 20 },
        textAlign: SC.ALIGN_CENTER,
        
        valueBinding: "Todos.tasksController.summary"
      })
    })
  })

});