Xamarin Forms Switch切换块ui

时间:2017-08-17 05:27:17

标签: c# xamarin xamarin.forms

我目前正在尝试实现两个链接的 Switch 元素。 当一个人被切换时,另一个被解锁。

但是当我的事件被触发时,点击的开关没有完成切换。

XAML:

<script>
function cambiarTrack(track) {
   var path =  track.getAttribute("path")
   // Get the image url from the img attribute:
   var img = track.getAttribute("img")
   // Assign it to the src attribute of the cover image:
   document.getElementById("img").src = img
   viejo_audio = document.getElementById("reproductor")
   audio_padre = viejo_audio.parentNode
   audio_padre.removeChild(viejo_audio)
   nuevo_audio = document.createElement("audio")
   nuevo_audio.setAttribute("id","reproductor")
   nuevo_audio.setAttribute("controls", "controls")
  // nuevo_audio.setAttribute("autoplay", "autoplay")
   source = document.createElement("source")
   source.setAttribute("src", path)
   source.setAttribute("type", "audio/mpeg")
   source.setAttribute("id", "reproductorSource")
   nuevo_audio.appendChild(source)
   audio_padre.appendChild(nuevo_audio)}
function cargarReproductor() {
         var select = document.getElementById("selectTrack")
         var path = select.options[0].getAttribute("path")
   nuevo_audio = document.createElement("audio")
   nuevo_audio.setAttribute("id","reproductor")
   nuevo_audio.setAttribute("controls", "controls")       
   source = document.createElement("source")
   source.setAttribute("src", path)
   source.setAttribute("type", "audio/mpeg")
   source.setAttribute("id", "reproductorSource")
   nuevo_audio.appendChild(source)
   padre = document.getElementById("reproductorBox")
   padre.appendChild(nuevo_audio)
}
</script>

<div id="reproductorBox" ></div>

<select id="selectTrack" multiple onchange="cambiarTrack(this.options[this.selectedIndex]) ; ">
<option  path="https://archive.org/download/heavypsyradio_3/HPR_Z.mp3" img="http://www.heavypsy.net/favicon.jpg">Heavy Psy Radio 3</option>
<option path="https://archive.org/download/heavypsyradio_Jul17/HPR_Y.mp3" img="http://via.placeholder.com/350x150">Heavy Psy Radio 2</option>
<option path="https://archive.org/download/HPRJun17/HPR_Jun17.mp3" img="http://via.placeholder.com/200x200">Heavy Psy Radio 1</option>
</select>
<script>cargarReproductor();</script>

<div id="cover">
 <img id="img" src="http://via.placeholder.com/100x100" class="img-responsive">
</div>

代码背后:

<StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
                    <Switch x:Name="WomanGenderSwitch" IsToggled="true"  Toggled="HandleWomanToggled" Scale="0.5">
                    </Switch>
                    <Label FontSize="12" x:Name="WomanSwitchLabel" TextColor="#ddd" VerticalTextAlignment="Center">
                    </Label>
                    <Switch x:Name="ManGenderSwitch" Toggled="HandleManToggled" Scale="0.5">
                    </Switch>
                    <Label FontSize="12" x:Name="ManSwicthLabel" TextColor="#ddd" VerticalTextAlignment="Center">
                    </Label>
                </StackLayout>

2 个答案:

答案 0 :(得分:3)

您可以为两个交换机重复使用相同的处理程序,因为切换另一个交换机将导致调用其处理程序,您需要禁用它,否则您最终会得到非结束事件纹波

XAML:

 if (RewardUtil.isConnected(mContext)) {
                    if (!TextUtils.isEmpty(m_szAmount)) {

                        if (m_szAmount.matches("[0-9]+")) {

                            int amount = Integer.parseInt(m_szAmount);

                            if (amount >= 10 && amount <= 1000) {

                                m_SubmitButton.setEnabled(true);

                            } else {

                                m_SubmitButton.setEnabled(true);


                            }

                        } else {

                            Log.d("format_issue", "number_format_issue");

                        }

                    }
                    } else {
                        try {
                            CSnackBar.showSnackBarError(m_MainLayout, getString(R.string.no_internet_connection_warning));

                        } catch (Exception e) {
                            e.printStackTrace();
                        }
                        m_SubmitButton.setEnabled(false);

                    }

删除/重新添加处理程序以中断事件链:

<StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
    <Switch x:Name="WomanGenderSwitch" IsToggled="true"  Toggled="HandleToggled" Scale="0.5" />
    <Label FontSize="12" x:Name="WomanSwitchLabel" TextColor="#ddd" VerticalTextAlignment="Center" />
    <Switch x:Name="ManGenderSwitch" Toggled="HandleToggled" Scale="0.5" />
    <Label FontSize="12" x:Name="ManSwicthLabel" TextColor="#ddd" VerticalTextAlignment="Center" />
</StackLayout>

或使用标志来打破事件链:

void HandleToggled(object sender, Xamarin.Forms.ToggledEventArgs e)
{
    var aSwitch = ((sender == WomanGenderSwitch) ? ManGenderSwitch : WomanGenderSwitch);
    aSwitch.Toggled -= HandleToggled;
    aSwitch.IsToggled = !aSwitch.IsToggled;
    aSwitch.Toggled += HandleToggled;
}

答案 1 :(得分:0)

正如Parsa所说,无论IsToggled如何,您的代码都会做同样的想法。

尝试这样的事情:

void HandleManToggled(object sender, Xamarin.Forms.ToggledEventArgs e)
        {
            var s = sender as Switch;
            if (s !=  null)
            {
                WomanGenderSwitch.IsToggled = s.IsToggled == false;
            }
        }



  void HandleWomanToggled(object sender, Xamarin.Forms.ToggledEventArgs e)
    {
        var s = sender as Switch;
        if (s !=  null)
        {
            ManGenderSwitch.IsToggled = s.IsToggled == false;
        }
    }