单击时要更改的选项卡图标

发布于 2024-12-12 04:15:35 字数 4496 浏览 0 评论 0原文

[底部的解决方案]

我需要一个选项卡来实现以下行为,但我不确定如何实现它:

  • 选项卡需要位于底部。
  • 选项卡需要一个图标和文本。
  • 每个图标都需要不同。
  • 图标在选择时需要改变颜色,并且选项卡需要覆盖。

我问得如此模糊的原因是我尝试过实施一种方法但遇到了障碍,所以我想知道更有经验的人会如何解决它。

根据要求的一些来源: CustomTabActivity.java

private TabHost mTabHost;
private Context ctx = this;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // construct the tabhost
    setContentView(R.layout.main);

    setupTabHost();
    mTabHost.getTabWidget().setDividerDrawable(R.drawable.tab_divider);
    setupTab(new TextView(this), "t1", R.drawable.myimg1);
    setupTab(new TextView(this), "t2", R.drawable.myimg2);
    mTabHost.setOnTabChangedListener(new OnTabChangeListener(){

        @Override
        public void onTabChanged(String tabId) {
            Log.e("Simon", "Current tab - " + Integer.toString(mTabHost.getCurrentTab()));
            View currentView = mTabHost.getChildAt(mTabHost.getCurrentTab());
            currentView.getClass();
        }

    });
}

private void setupTabHost() {
    mTabHost = (TabHost) findViewById(android.R.id.tabhost);
    mTabHost.setup();
}

private void setupTab(final View view, final String tag, int num) {
    View tabview = createTabView(mTabHost.getContext(), tag, num);

    TabSpec setContent = mTabHost.newTabSpec(tag).setIndicator(tabview).setContent(new TabContentFactory() {
        public View createTabContent(String tag) {return view;}
    });
    mTabHost.addTab(setContent);
}

private static View createTabView(final Context context, final String text, final int num) {
    View view = LayoutInflater.from(context).inflate(R.layout.tabs_bg, null);
    TextView tv = (TextView) view.findViewById(R.id.tabsText);
    tv.setText(text);

    ImageView iv = (ImageView) view.findViewById(R.id.tabsImg);

    iv.setImageResource(num);
    return view;
}

main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@android:id/tabhost" android:layout_width="fill_parent" android:layout_height="fill_parent">
        <LinearLayout android:orientation="vertical"
            android:layout_width="fill_parent" android:layout_height="fill_parent">
            <FrameLayout android:id="@android:id/tabcontent"
                android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1">
                <ViewStub android:id="@+id/stub1"
                   android:inflatedId="@+id/subTree"
                   android:layout="@layout/mylayout"
                   android:layout_width="fill_parent"
                   android:layout_height="fill_parent" />
            </FrameLayout>
            <TabWidget android:id="@android:id/tabs" 
                android:layout_width="fill_parent" android:background="@drawable/tabs_bg" android:layout_height="wrap_content"/>
        </LinearLayout>
    </TabHost>

</LinearLayout>

mylayout.xml

<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
    <Button android:text="Button" android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
    <ProgressBar android:layout_width="wrap_content" android:layout_height="wrap_content" style="?android:attr/progressBarStyleLarge" android:id="@+id/progressBar1"></ProgressBar>

</LinearLayout>

----------------解决办法--------------

所以问题就解决了。我已将 res/drawable-[hdpi|ldpi|mdpi] 文件夹中的 R.drawable.myimg1 替换为静态图像,并将其替换为 res/drawable 中的新 xml 文件,如下所示

mydrawable1.xml

<?xml version="1.0" encoding="utf-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true"
        android:drawable="@drawable/myimg1_selected"/>
    <item android:drawable="@drawable/myimg1"/>
</selector>

: myimg1 和 myimg1_selected 是我想要在不同状态下显示的图像。

[Solution at the bottom]

I need a tab to have the following behaveyour but am not sure how to implement it:

  • The tabs need to be at the bottom.
  • The tabs need an icon & text.
  • Each icon needs to be different.
  • The icon needs to change colour when selected and the tab needs an overlay.

The reason I'm asking so vaguely is that I've tried implementing one way but hit a brick wall so I'm wondering how the more experienced would go about it.

Some source as requested:
CustomTabActivity.java

private TabHost mTabHost;
private Context ctx = this;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // construct the tabhost
    setContentView(R.layout.main);

    setupTabHost();
    mTabHost.getTabWidget().setDividerDrawable(R.drawable.tab_divider);
    setupTab(new TextView(this), "t1", R.drawable.myimg1);
    setupTab(new TextView(this), "t2", R.drawable.myimg2);
    mTabHost.setOnTabChangedListener(new OnTabChangeListener(){

        @Override
        public void onTabChanged(String tabId) {
            Log.e("Simon", "Current tab - " + Integer.toString(mTabHost.getCurrentTab()));
            View currentView = mTabHost.getChildAt(mTabHost.getCurrentTab());
            currentView.getClass();
        }

    });
}

private void setupTabHost() {
    mTabHost = (TabHost) findViewById(android.R.id.tabhost);
    mTabHost.setup();
}

private void setupTab(final View view, final String tag, int num) {
    View tabview = createTabView(mTabHost.getContext(), tag, num);

    TabSpec setContent = mTabHost.newTabSpec(tag).setIndicator(tabview).setContent(new TabContentFactory() {
        public View createTabContent(String tag) {return view;}
    });
    mTabHost.addTab(setContent);
}

private static View createTabView(final Context context, final String text, final int num) {
    View view = LayoutInflater.from(context).inflate(R.layout.tabs_bg, null);
    TextView tv = (TextView) view.findViewById(R.id.tabsText);
    tv.setText(text);

    ImageView iv = (ImageView) view.findViewById(R.id.tabsImg);

    iv.setImageResource(num);
    return view;
}

main.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@android:id/tabhost" android:layout_width="fill_parent" android:layout_height="fill_parent">
        <LinearLayout android:orientation="vertical"
            android:layout_width="fill_parent" android:layout_height="fill_parent">
            <FrameLayout android:id="@android:id/tabcontent"
                android:layout_width="fill_parent" android:layout_height="fill_parent" android:layout_weight="1">
                <ViewStub android:id="@+id/stub1"
                   android:inflatedId="@+id/subTree"
                   android:layout="@layout/mylayout"
                   android:layout_width="fill_parent"
                   android:layout_height="fill_parent" />
            </FrameLayout>
            <TabWidget android:id="@android:id/tabs" 
                android:layout_width="fill_parent" android:background="@drawable/tabs_bg" android:layout_height="wrap_content"/>
        </LinearLayout>
    </TabHost>

</LinearLayout>

mylayout.xml

<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:orientation="vertical"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent">
    <Button android:text="Button" android:id="@+id/button1" android:layout_width="wrap_content" android:layout_height="wrap_content"></Button>
    <ProgressBar android:layout_width="wrap_content" android:layout_height="wrap_content" style="?android:attr/progressBarStyleLarge" android:id="@+id/progressBar1"></ProgressBar>

</LinearLayout>

--------------Solution-------------

So the issue is solved. I've replaced the R.drawable.myimg1 from being a static image in the res/drawable-[hdpi|ldpi|mdpi] folders and replaced it with a new xml file in res/drawable that looks like this:

mydrawable1.xml

<?xml version="1.0" encoding="utf-8"?>
<selector
  xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true"
        android:drawable="@drawable/myimg1_selected"/>
    <item android:drawable="@drawable/myimg1"/>
</selector>

Where myimg1 and myimg1_selected are the images I want shown in different states.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

梅倚清风 2024-12-19 04:15:35

查看本教程。它描述了如果选择选项卡如何更改图标。

Check this tutorial. It describes how to change icon if tab is selected.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文