Flow two sections on small screen

src/AutoPilotPlugins/APM/APMFlightModesComponent.qml

@@ -44,8 +44,16 @@ QGCView {
         QGCFlickable {
             anchors.fill:       parent
             clip:               true
-            flickableDirection: Flickable.VerticalFlick
-            contentHeight:      flightModeSettings.y + flightModeSettings.height
+            contentHeight:      flowLayout.height
+            contentWidth:       flowLayout.width
+
+            Flow {
+                id:         flowLayout
+                width:      panel.width // parent.width doesn't work here for some reason!
+                spacing:     _margins
+
+                Column {
+                    spacing: _margins
 
                     QGCLabel {
                         id:             flightModeLabel
@@ -55,8 +63,6 @@ QGCView {
 
                     Rectangle {
                         id:     flightModeSettings
-                anchors.topMargin:  _margins
-                anchors.top:        flightModeLabel.bottom
                         width:  flightModeColumn.width + (_margins * 2)
                         height: flightModeColumn.height + ScreenTools.defaultFontPixelHeight
                         color:  qgcPal.windowShade
@@ -99,7 +105,6 @@ QGCView {
                                     property int index:         modelData + 1
                                     property var pwmStrings:    [ "PWM 0 - 1230", "PWM 1231 - 1360", "PWM 1361 - 1490", "PWM 1491 - 1620", "PWM 1621 - 1749", "PWM 1750 +"]
 
-
                                     QGCLabel {
                                         anchors.baseline:   modeCombo.baseline
                                         text:               qsTr("Flight Mode ") + index + ":"
@@ -121,26 +126,23 @@ QGCView {
                             } // Repeater - Flight Modes
                         } // Column - Flight Modes
                     } // Rectangle - Flight Modes
+                } // Column - Flight Modes
+
+                Column {
+                    spacing:    _margins
+                    visible:    _channelOptionCount != 0
 
                     QGCLabel {
                         id:                 channelOptionsLabel
-                anchors.leftMargin: _margins
-                anchors.top:        parent.top
-                anchors.left:       flightModeSettings.right
                         text:               qsTr("Channel Options")
                         font.family:        ScreenTools.demiboldFontFamily
-                visible:            _channelOptionCount != 0
                     }
 
                     Rectangle {
                         id:     channelOptionsSettings
-                anchors.topMargin:  _margins
-                anchors.top:        channelOptionsLabel.bottom
-                anchors.left:       channelOptionsLabel.left
                         width:  channelOptColumn.width + (_margins * 2)
                         height: channelOptColumn.height + ScreenTools.defaultFontPixelHeight
                         color:  qgcPal.windowShade
-                visible:            _channelOptionCount != 0
 
                         Column {
                             id:                 channelOptColumn
@@ -174,6 +176,8 @@ QGCView {
                             } // Repeater -- Channel options
                         } // Column - Channel options
                     } // Rectangle - Channel options
+                } // Column - Channel options
+            } // Flow
         } // QGCFlickable
     } // QGCViewPanel
 } // QGCView