RadioGroup变为按钮工具条

本文介绍了一个使用XML布局的音乐播放器控制按钮实现方法,通过RadioGroup包含三个RadioButton来表示上一曲、播放/暂停和下一曲功能,并展示了如何通过监听器实现按钮状态的切换。
xml设置
复制代码
<RadioGroup android:id="@+id/MusicList_RadioGroup"
                android:orientation="horizontal" android:layout_alignParentBottom="true"
                android:layout_width="match_parent" android:layout_height="wrap_content"
                android:padding="2.0dip"
                android:background="@drawable/radiogroup_bg"
                >
       
        <RadioButton android:id="@+id/MusicList_RadioGroup_next" 
                     android:drawableLeft="@drawable/radiogroup_next"
                     android:text="@string/Text_radiogroup_next"
                     android:textSize="15.0dip"
                     android:layout_weight="1.0" android:button="@null"
                     android:layout_width="wrap_content" android:layout_height="wrap_content"
                     />        
        <RadioButton android:id="@+id/MusicList_RadioGroup_playAndpuse" 
                     android:drawableLeft="@drawable/radiogroup_play"
                     android:text="@string/Text_radiogroup_play"
                     android:textSize="15.0dip"
                     android:layout_weight="1.0" android:button="@null"
                     android:layout_width="wrap_content" android:layout_height="wrap_content"
                     />                
        <RadioButton android:id="@+id/MusicList_RadioGroup_previous" 
                     android:drawableLeft="@drawable/radiogroup_previous"
                     android:text="@string/Text_radiogroup_previous"
                     android:textSize="15.0dip"
                     android:layout_weight="1.0" android:button="@null" 
                     android:layout_width="wrap_content" android:layout_height="wrap_content"
                     />            
    </RadioGroup>
复制代码

绑定监听的代码  

复制代码
        //绑定监听器
        MusicListTable_RadioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener(){
            public void onCheckedChanged(RadioGroup arg0, int rid) {
                switch(rid)
                {
                    case R.id.MusicList_RadioGroup_next://下一首
                        break;
                    case R.id.MusicList_RadioGroup_previous://上一首
                        break;
                    case R.id.MusicList_RadioGroup_playAndpuse://播放或暂停
                        if(isPlaying)
                        {
                            Drawable dr= res.getDrawable(R.drawable.radiogroup_play);
                            //setBounds如果不设置的话setCompoundDrawables就会没有图片显示出来,所以一定要设置一次
                            dr.setBounds(0, 0, dr.getMinimumWidth(), dr.getMinimumHeight());
                            palyAndpuse.setCompoundDrawables(dr, null,null, null);//为RadioButton设置图片,左右上下对应xml的android:drawableLeft="@drawable/XXX"
                            isPlaying=false; 
                        }
                        else
                        {
                            Drawable dr= res.getDrawable(R.drawable.radiogroup_puse);
                            dr.setBounds(0, 0, dr.getMinimumWidth(), dr.getMinimumHeight());
                            palyAndpuse.setCompoundDrawables(dr, null,null, null);
                            isPlaying=true;                 
                        }
                        arg0.clearCheck();//清除选择,如果不清除的话不能重复选择同一个Radiobutton
                        break;
                }
                
            }});
    }
复制代码

效果:

点击播放不断切换两个图片  


转自:http://www.cnblogs.com/helloandroid/archive/2011/08/23/2151164.html

将这里面的 <a-drawer title="工具栏" placement="left" :closable="true" :visible="drawerVisible" @close="drawerClose" :width="'20%'" > <div> <font color="#00008F"> <b>标题:</b></font> <a-popover title="提示" trigger="hover" placement="right" > <template slot="content"> <p>1)此处的标题可以随意更改,仅针对当前操作有效</p> <p>2)标题变更是针对分析结果的表格标题名字进行更换</p> </template> <a-icon type="question-circle" style="cursor: pointer;color: #1890FF;"> </a-icon> </a-popover> <br/> <a-input placeholder="重命名列标题" v-model="dimTitle" @change="changeTitle"></a-input> </div> <div v-show="isSearchChildDim"> <br/> <font color="#00008F"><b>检索式查找:</b></font> <a-input-search placeholder="输入维度关键字查找" v-model="dimNameKeyWord" style="width: 200px" @search="searchChildDim" /> <a-checkbox-group v-model="tempSelectedList" :style="{width: '100%'}"> <a-row> <a-col :span="24" v-for="item of tempSearchList" :key="item.dimId"> <a-checkbox :value="item.dimName" @change="onChange($event,item)"> {{item.dimChName}} </a-checkbox> </a-col> </a-row> </a-checkbox-group> </div> <a-divider v-show="isSearchChildDim" orientation="left"> 已选值: </a-divider> <div> <div v-show="sectionVisible"> <br/> <font color="#00008F"><b>自定义区间:</b></font> <a-switch v-model="sectionChecked" size="small"/> <!-- <a-popover title="提示" trigger="hover" placement="right" > <template slot="content"> <p>1)自定义区间只作用于维度</p> <p>2)启用自定义区间之后,表格和图表的维度都将变为自定义区间</p> </template> <a-icon type="question-circle" style="cursor: pointer;color: #1890FF;"> </a-icon> </a-popover> --> </div> <div v-show="sortVisible"> <br/> <font color="#00008F"><b>排序:</b></font> <a-radio-group name="radioGroup" v-model="currentSortType"> <a-radio :value="'ASC'"> 升序 </a-radio> <a-radio :value="'DESC'"> 降序 </a-radio> </a-radio-group> </div> <br/> <div v-show="!sectionChecked"> <font color="#00008F"><b>筛选:</b></font> <a-popover title="提示" trigger="hover" placement="right" > <template slot="content"> <p>1)此处的筛选可以同时作用到筛选器、行标签、列标签</p> <p>2)筛选完成后,非全选情况下的维度文字颜色会变成橘色</p> </template> <a-icon type="question-circle" style="cursor: pointer;color: #1890FF;"> </a-icon> </a-popover> <br/> <a-checkbox value="" :checked="childrenSelectedObj.checkAll" @change="selectAll($event)"><b>全选/取消</b></a-checkbox> <a-checkbox style="margin-left: 22%" v-if="showMergeOthers" :checked="mergeOthers" @change="mergeClick($event)"><b>合并其他</b></a-checkbox> <a-checkbox-group v-model="childrenSelectedObj.list" :style="{width: '100%'}"> <a-row v-if="sectionList != undefined && sectionList.length == 0"> <a-col :span="fullWidthDimList.indexOf(childrenSelectedObj.dimName) > -1 || fullWidthDimList.indexOf('*') > -1 ? 24 : 12" v-for="item of childrenList" :key="item.dimId"> <a-checkbox :value="item.dimName"> {{item.dimChName}} </a-checkbox> </a-col> </a-row> <a-row v-if="sectionList != undefined && sectionList.length > 0"> <a-col :span="fullWidthDimList.indexOf(childrenSelectedObj.dimName) > -1 || fullWidthDimList.indexOf('*') > -1 ? 24 : 12" v-for="(item,index) of sectionList" :key="index" > <a-checkbox :value="item"> {{item}} </a-checkbox> </a-col> </a-row> </a-checkbox-group> <br/><br/> <a-button v-show="isSearchChildDim" type="primary" @click="clearSelected" block> 清空已选择的数据 </a-button> <div v-show="sectionList.length == 0"> <font color="#00008F"><b>维度组合:</b></font><font color="#FF151F">创建分类》添加子项</font>  <a-popover title="提示" trigger="hover" placement="right" > <template slot="content"> <p>1)创建分类处的名称由用户随意定义,但需注意多个分类不能出现重复名称</p> <p><font color="red">2)建议分析完成后保存该组合任务到我的任务列表,避免下次重复操作</font></p> </template> <a-icon type="question-circle" style="cursor: pointer;color: #1890FF;"> </a-icon> </a-popover> <br/> <a-input-search placeholder="定义分类名称" @search="createDimGroup" v-model="dimGroupName"> <a-button slot="enterButton" type="primary"> 创建分类 </a-button> </a-input-search> <a-card size="small" :title="groupName" class="group-card-atm" v-for="(groupChild,groupName,index) in currentDimGroup" :key="index"> <a slot="extra"> <a-tooltip title="是否有效"> <a-switch size="small" :checked="getDimGroupValidStatus(groupName)" @change="changeDimGroupValid(groupName, $event)"/> </a-tooltip> </a> <a slot="extra"> <a-tooltip title="添加子项"> <a-button type="link" size="small" shape="circle" icon="plus" @click="openDimGroupChildModel(groupName)"></a-button> </a-tooltip> </a> <a slot="extra" > <a-tooltip title="重命名"> <a-button type="link" size="small" shape="circle" icon="edit" @click="getGroupName(groupName)"></a-button> </a-tooltip> </a> <a-popconfirm title="您确定要删除该维度组合吗?" ok-text="是" cancel-text="否" @confirm="deleteDimGroup(groupName)" slot="extra" >    <a-tooltip title="删除"> <a-icon type="delete" class="dimgroup-delete-atm" /> </a-tooltip> </a-popconfirm> <p class="dimension-p-atm text-default-atm" v-for="dimChName of groupChild" :key="dimChName"> {{dimChName}} <span class="dimension-remove-atm" @click="removeGroupChild(groupName,dimChName)"> <a-tooltip title="删除"><a-icon type="delete" /></a-tooltip> </span> </p> </a-card> </div> </div> <div style="margin: 0 0 10px 0;" v-show="sectionVisible && sectionChecked"> <font color="#00008F"><b>区间操作:</b></font> <a-popover title="提示" trigger="hover" placement="right" > <template slot="content"> <p>1)自定义区间只作用于维度</p> <p>2)启用自定义区间之后,表格和图表的维度都将变为自定义区间</p> <p>3)输入区间时,左右区间需确保都不为空;左右区间需确保都为数字;左右区间需确保 左区间 <= 右区间</p> </template> <a-icon type="question-circle" style="cursor: pointer;color: #1890FF;"> </a-icon> </a-popover> <br/> <div style="margin: 0 0 10px 0;"> <font><b>左区间:</b></font><a-input placeholder="自定义左区间" v-model="leftSection" style="width: 50%;margin-bottom:10px;"/> <br/> <a-radio-group name="sectionLeftGroup" v-model="sectionLeftType"> <a-radio :value="'('"> 开区间 </a-radio> <a-radio :value="'['"> 闭区间 </a-radio> </a-radio-group> <br/> <font><b>右区间:</b></font><a-input placeholder="自定义右区间" v-model="rightSection" style="width: 50%;margin: 10px 0 10px 0;"/> <a-radio-group name="sectionRightGroup" v-model="sectionRightType"> <a-radio :value="')'"> 开区间 </a-radio> <a-radio :value="']'"> 闭区间 </a-radio> </a-radio-group> <a-space> <a-button type="primary" @click="addSection(leftSection, sectionLeftType, rightSection,sectionRightType)">添加</a-button> </a-space> </div> <div v-show="mySectionList != null && mySectionList.length>0"> <br/> <font><b>已添加的区间:</b></font> <a-card size="small" class="group-card-atm" v-for="(section,index) in mySectionList" :key="index"> <p class="dimension-p-atm text-default-atm"> {{ section }} <span class="dimension-remove-atm" @click="removeSectionSel(index)"> <a-tooltip title="删除"><a-icon type="delete" /></a-tooltip> </span> </p> </a-card> <a-space> <a-button type="primary" @click="saveSectionSel(dimItem)">保存区间</a-button> <a-button type="primary" @click="deleteAllSectionSel(dimItem)">全部删除</a-button> </a-space> </div> </div> </div> </a-drawer> <a-modal v-model="updateGroupName" title="维度组合名称修改" ok-text="确认" cancel-text="取消" @ok="groupNameUpdate"> <a-input placeholder="请输入修改名称" v-model="gName"></a-input> </a-modal> <a-modal v-model="dimGroupChildModel.visible" :title="dimGroupChildModel.groupName" :maskClosable="false" @ok="dimGroupChildHandleOk"> <a-checkbox :checked="checked" @change="onCheckAllChange"> 全选/取消 </a-checkbox> <br> <div style="height: 550px;overflow-y: auto"> <a-checkbox-group v-model="dimGroupChildModel.selectedList"> <a-row v-for="dimName of childrenSelectedObj.list" :key="dimName"> <a-checkbox :value="dimName" :disabled="dimGroupChildModel.disabledList.indexOf(dimName) > -1"> {{ dimName }} </a-checkbox> </a-row> </a-checkbox-group> </div> </a-modal> 这部分代码拆分成一个组件,并保证原有功能正常
最新发布
09-19
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值