Adding ScrollView Causes button clicks not to fire.
here is my index.ui code:
<svg viewport-fill="white">
<svg id="screen1">
<svg id="background">
<text id="time" />
<text id="date" />
<text id="heart" />
<!-- <text id="resting-heart" /> -->
<text id="battery" />
<rect id="calories" x="0%" y="0%" width="0%" height="2%" fill="fb-white" />
<rect id="distance" x="0%" y="96%" width="0%" height="2%" fill="fb-white" />
<rect id="steps" x="0%" y="98%" width="0%" height="2%" fill="fb-white" />
<rect id="elevationGain" x="99%" y="0%" width="2%" height="0%" fill="fb-white" />
<rect id="activeMinutes" x="0%" y="0%" width="2%" height="0%" fill="fb-white" />
</svg>
</svg>
<svg id="q1-screen" >
<text id="Question1" x="50%" y="33"
font-family="System-Regular" fill="black"
font-size="18" font-weight="bold"
text-anchor="middle">How’s the thermal environment?</text>
<use id="btnQ1Comfy" href="#square-button-icon" y="20%" fill="green">
<set href="#text" attributeName="text-buffer" to="I am Comfy" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgAmComfy" href="am-comfy.png" width="30" height="30" x="20" y="22" />
</use>
<use id="btnQ1UnComfy" href="#square-button-icon" y="50%" fill="green" >
<set href="#text" attributeName="text-buffer" to="I am Uncomfy" />
<!--<set href="#image" attributeName="href" to="am-uncomfy.png" />-->
<image id="imgUnComfy" href="am-uncomfy.png" width="30" height="30" x="20" y="22" />
</use>
</svg>
<svg id="q2-screen">
<use href="#scrollview">
<use href="#scrollview-item">
<image href="am-uncomfy.png" />
</use>
<use href="#scrollview-item">
<image href="am-comfy.png" />
</use>
<!--<use href="#scrollview-item">
<image href="03.png" />
</use>-->
</use>
</svg>
<svg id="q3-screen" >
<text id="Question3" x="50%" y="33"
font-family="System-Regular" fill="black"
font-size="24" font-weight="bold"
text-anchor="middle">Which Parameter do you want to change most?</text>
<use id="btnQ3Humidity" href="#square-button-icon" y="20%" fill="red">
<set href="#text" attributeName="text-buffer" to="Humidity" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgQ3Humidity" href="humidity.png" width="30" height="30" x="20" y="22" />
</use>
<use id="btnQ3WindSpeed" href="#square-button-icon" y="50%" fill="red">
<set href="#text" attributeName="text-buffer" to="Wind Speed" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgQ3WindSpeed" href="wind-speed.png" width="30" height="30" x="20" y="22" />
</use>
<use id="btnQ3Sun" href="#square-button-icon" y="80%" fill="red" >
<set href="#text" attributeName="text-buffer" to="Sun" />
<!--<set href="#image" attributeName="href" to="am-uncomfy.png" />-->
<image id="imgQ3Sun" href="sun.png" width="30" height="30" x="20" y="22" />
</use>
<use id="btnQ3NoChange" href="#square-button-icon" y="100%" fill="red" >
<set href="#text" attributeName="text-buffer" to="No Change" />
<!--<set href="#image" attributeName="href" to="am-uncomfy.png" />-->
<image id="imgQ3NoChange" href="no-change.png" width="30" height="30" x="20" y="22" />
</use>
</svg>
<svg id="q4a-screen" fill="white" >
<text id="Question4a" x="50%" y="33"
font-family="System-Regular" fill="black"
font-size="24" font-weight="bold"
text-anchor="middle">How’s the Humidity?</text>
<use id="btnQ4aPrefDryer" href="#square-button-icon" y="20%">
<set href="#text" attributeName="text-buffer" to="Prefer Dryer" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<!--<image id="imgQ4PrefDryer" href="humidity.png" width="30" height="30" x="20" y="22" />-->
<set href="#stroke" attributeName="href" to="/mnt/sysassets/widgets/images/square_button/btn_square_fill_p.9.png" />
<set href="#stroke" attributeName="fill" to="#F2F2F2" />
</use>
<!--<use id="mybutton" href="#square-button" y="5" fill="fb-red">
<set href="#text" attributeName="text-buffer" to="Click Me!" />
<image id="imgQ4aPrefWetter" href="pref-wetter.png" width="30" height="30" x="20" y="22" />
<set href="#stroke" attributeName="href" to="/mnt/sysassets/widgets/images/square_button/btn_square_fill_p.9.png" />
<set href="#stroke" attributeName="fill" to="#27D9FF" />
</use>-->
<mask id="ButtonMask">
<use id="btnQ4aPrefWetter" href="#square-button" y="50%" >
<set href="#text" attributeName="text-buffer" to="Prefer Wetter" />
<!--<set href="#stroke" attributeName="href" to="/mnt/sysassets/widgets/images/square_button/btn_square_fill_p.9.png" />-->
<image id="imgQ4aPrefWetter" href="pref-wetter.png" width="30" height="30" x="20" y="22" />
<set href="#stroke" attributeName="fill" to="black" />
</use>
</mask>
<svg mask="#ButtonMask" width="100%" height="100%">
<gradientRect width="100%" height="100%"
gradient-type="linear"
gradient-x1="0" gradient-y1="50%"
gradient-x2="0" gradient-y2="100%-50"
gradient-color1="green"
gradient-color2="black" />
</svg>
</svg>
<svg id="q4b-screen" fill="white" >
<text id="Question4b" x="50%" y="33"
font-family="System-Regular" fill="black"
font-size="24" font-weight="bold"
text-anchor="middle">How’s the Wind speed?</text>
<use id="btnQ4bPrefCalmer" href="#square-button-icon" y="20%" fill="green">
<set href="#text" attributeName="text-buffer" to="Prefer Calmer" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgQ4bPrefCalmer" href="pref-calmer.png" width="30" height="30" x="20" y="22" />
</use>
<use id="btnQ4bPrefWindier" href="#square-button-icon" y="50%" fill="green">
<set href="#text" attributeName="text-buffer" to="Prefer Windier" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgQ4bPrefWindier" href="pref-windier.png" width="30" height="30" x="20" y="22" />
</use>
</svg>
<svg id="q4c-screen" fill="white" >
<text id="Question4c" x="50%" y="33"
font-family="System-Regular" fill="black"
font-size="24" font-weight="bold"
text-anchor="middle">How’s the Sun?</text>
<use id="btnQ4cPrefSunnier" href="#square-button-icon" y="20%" fill="green">
<set href="#text" attributeName="text-buffer" to="Prefer Sunnier" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgQ4cPrefSunner" href="pref-sunnier.png" width="30" height="30" x="20" y="22" />
</use>
<use id="btnQ4cPrefDarker" href="#square-button-icon" y="50%" fill="green">
<set href="#text" attributeName="text-buffer" to="Prefer Darker" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgQ4CPrefDarker" href="pref-darker.png" width="30" height="30" x="20" y="22" />
</use>
</svg>
<svg id="q5-screen" fill="white" >
<text id="Question5" x="50%" y="33"
font-family="System-Regular" fill="black"
font-size="24" font-weight="bold"
text-anchor="middle">Where are you?</text>
<use id="btnQ5Indoor" href="#square-button-icon" y="20%" fill="green">
<set href="#text" attributeName="text-buffer" to="Indoor" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgQ5Indoor" href="indoor.png" width="30" height="30" x="20" y="22" />
</use>
<use id="btnQ5Outdoor" href="#square-button-icon" y="50%" fill="green">
<set href="#text" attributeName="text-buffer" to="Outdoor" />
<!--<set href="#image" attributeName="href" to="am-comfy.png" />-->
<image id="imgQ5Outdoor" href="outdoor.png" width="30" height="30" x="20" y="22" />
</use>
</svg>
</svg>
-------------------------------------------------
As Soon as i remove the ScrollView in q2-screen the buttons in q1-screen start working.
my widgets.ui is as follows:
<svg>
<defs>
<link rel="stylesheet" href="styles.css" />
<link rel="import" href="/mnt/sysassets/widgets_common.gui" />
<!-- Additional Imports -->
<link rel="stylesheet" href="/mnt/sysassets/widgets/dynamic_textarea.css"/>
<link rel="import" href="/mnt/sysassets/widgets/push_button_widget.gui" />
<link rel="import" href="/mnt/sysassets/widgets/dynamic_textarea.gui"/>
<link rel="import" href="/mnt/sysassets/widgets/mixed_text_widget.gui"/>
<link rel="import" href="/mnt/sysassets/widgets/square_button_widget.gui" />
<!--ScrollView Imports-->
<link rel="import" href="/mnt/sysassets/widgets/baseview_widget.gui" />
<link rel="import" href="/mnt/sysassets/widgets/scrollview_widget.gui" />
</defs>
</svg>
