Question

在Lollipop之前的Android版本中，有没有办法让开关的拇指高度大于轨道高度？

我基本上试图在Kitkat中创建一个类似材料设计的开关小部件（和旧版本一样 - 这里的问题是默认情况下拇指'适合'在轨道内）。我已经在这方面工作了很长一段时间，但我似乎无法达到正确的设计。

我按照此SO帖子的解决方案：How to change the size of a Switch Widget。

非常感谢任何建议或解决方案。

Answer 1

我在我的轨道可绘制形状上添加了一个透明笔划，这会导致在轨道周围填充：

FacebookSDKs-iOS-20150625

Answer 2

烨我解决了这个问题

 <android.support.v7.widget.SwitchCompat
                   android:id="@+id/mySwitch"
                   android:layout_width="wrap_content"
                   android:layout_height="wrap_content"
                   android:textOn="ON"
                   android:textOff="OFF"
                   style="@style/Color1SwitchStyle"
                   android:text="" />

这是我的Color1SwitchStyle

 <style name="Color1SwitchStyle">
    <item name="android:thumb">@drawable/customswitchselector</item>
    <item name="android:track">@drawable/my_custom_track</item>
     //when use Switch in xml file 
    <item name="track">@drawable/my_custom_track</item>
    //when use android.support.v7.widget.SwitchCompat in xml

</style>

*听到的是我的customswitchselector.xml

 <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android" >
      <item android:state_checked="true"
        android:drawable="@drawable/on" >
       <shape
            android:shape="rectangle"
            android:dither="true"
            android:useLevel="false"
            android:visible="true">

            <gradient
                android:startColor="#66AAFF00"
                android:endColor="#6600FF00"
                android:angle="270"/>
            <corners
                android:radius="15dp"/>

            <size
                android:width="200dp"
                android:height="80dp" />
            <stroke
                android:width="4dp"
                android:color="#0000ffff"/>
        </shape>
    </item>
    <item android:state_checked="false"
        android:drawable="@drawable/off">
        <shape
            android:shape="rectangle"
            android:dither="true"
            android:useLevel="false"
            android:visible="true">

            <gradient
                android:startColor="#66AAFF00"
                android:endColor="#6600FF00"
                android:angle="270"/>
            <corners
                android:radius="15dp"/>

            <size
                android:width="200dp"
                android:height="80dp" />
            <stroke
                android:width="4dp"
                android:color="#0000ffff"/>
        </shape>
    </item>

</selector>

听到我的my_custom_track.xml是神奇的

<?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">
        <item
            android:state_checked="true"
            android:state_enabled="true"
            android:drawable="@drawable/switch_track_on" />
        <item
            android:state_checked="false"
            android:state_enabled="false"
            android:drawable="@drawable/switch_track_off" />
    </selector> 





switch_track_on.xml 
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            android:shape="rectangle"
            android:dither="true"
            android:useLevel="false"
            android:visible="true">
            <gradient
                android:startColor="@color/profile_pic_bg"
                android:endColor="@color/profile_pic_bg"
                android:angle="270"/>
            <corners
                android:radius="0dp"/>
            <size
                android:width="100dp"
                android:height="10dp" />

            <stroke
                android:width="12dp"
                android:color="#00ffffff"/>
        </shape>
    </item>
</layer-list>



    switch_track_off.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape
            android:shape="rectangle"
            android:dither="true"
            android:useLevel="false"
            android:visible="true">
            <gradient
                android:startColor="@color/gray"
                android:endColor="@color/gray"
                android:angle="270"/>
            <corners
                android:radius="0dp"/>
            <size
                android:width="100dp"
                android:height="10dp" />

            <stroke
                android:width="12dp"
                android:color="#00ffffff"/>
        </shape>
    </item>
</layer-list>

感谢史蒂文没有你的评论我无法解决这个问题

Jason

Answer 3

在“ track”可绘制作品中为我添加顶部和底部插图。 android:bottom="5dp" android:top="5dp"

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item
    android:bottom="5dp"
    android:top="5dp">
    <shape>
        <corners android:radius="15dp" />
        <solid android:color="@android:color/transparent" />
        <stroke
            android:width="2dp"
            android:color="#EEEEEE" />
    </shape>
</item>

<androidx.appcompat.widget.SwitchCompat
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:track="@drawable/switch_track_drawable" />

Answer 4

我提出的解决方案只是为轨道使用rectangle而不是stroke的形状，并在其<android.support.v7.widget.SwitchCompat android:id="@+id/my_switch" android:layout_width="wrap_content" android:layout_height="wrap_content" app:track="@drawable/switch_track" app:theme="@android:style/Theme.DeviceDefault.Light" />中明确设置宽度。

例如，如果开关定义如下：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:state_checked="false" >
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line" >
            <stroke android:color="#50bbb9bf" android:width="5dp"/>
        </shape>
    </item>
    <item android:state_checked="true">
        <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
            <stroke android:color="#5000b6de" android:width="5dp"/>
        </shape>
    </item>
</selector>

switch_track.xml中的drawable使用您想要的任何宽度的线形：

var tds = document.querySelectorAll('td');

var highlight = function () {
    // take this person's name from the 2nd cell
    var name = this.parentNode.children[1].innerHTML;
    // highlight cells with same name
    tds.forEach(function (td) {
        var tr = td.parentNode;
        // compare other's person name with this person name
        // highlight if there is a match
        tr.classList.toggle('highlight', tr.children[1].innerHTML === name)
    });
}
// attach an event listener to all cells
tds.forEach(function (td) {
    td.onmouseover = highlight;
});

Android开关 - 使拇指高度大于轨道高度，如何？

4 个答案: