将图标放在tablayout上

时间:2017-11-24 20:21:23

标签: android

我正在尝试在我的tablayout上放置一个图标。我的tablayout固定了6个标签。我的图标应放在第二个标签图标旁边。我尝试使用代码,它在模拟器上工作得很好,但在真实设备上却没有。

我的代码:

Tablayout.xml和图标

<android.support.design.widget.TabLayout
        android:id="@+id/tabs2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabIndicatorColor="#40436F"
        android:layout_marginRight="10dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="60dp"
        android:layout_marginBottom="15dp"
        android:background="@drawable/tab_bar_bg"
        android:visibility="visible"
        app:tabPaddingEnd="0dp"
        app:tabPaddingStart="0dp"
        app:tabIndicatorHeight="2dp"
        app:tabMode="fixed"
        app:tabMinWidth="58dp"
        app:tabGravity="center"/>

    <RelativeLayout
        android:id="@+id/notification_bg"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginLeft="0dp"
        android:layout_marginStart="0dp"
        android:layout_marginTop="63dp"
        android:visibility="gone">

    <ImageView

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/notification_bg"
        />

    <TextView
        android:id="@+id/textView32"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="0"
        android:textSize="12sp"
        android:textColor="#fff"
        android:textStyle="bold"
        android:layout_centerInParent="true"/>
    </RelativeLayout>

并且代码:

@Override
public void onWindowFocusChanged(boolean hasFocus) {
    super.onWindowFocusChanged(hasFocus);
    int marginDp=(pxToDp(tabLayout.getWidth()))/6*2;
    RelativeLayout.LayoutParams relativeParams = (RelativeLayout.LayoutParams)badgeView.getLayoutParams();
    relativeParams.setMargins(Math.round(TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, marginDp, getResources().getDisplayMetrics())), Math.round(TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 63, getResources().getDisplayMetrics())), 0, 0);  // left, top, right, bottom
    badgeView.setLayoutParams(relativeParams);
}

在模拟器上(这就是我想要的):

enter image description here

这是在设备上(它放错了)

enter image description here

我该如何解决这个问题?

此外,我不知道这种方式是否最好能够实现这一目标。你可以建议我另一种方法来做这件事。 :)

2 个答案:

答案 0 :(得分:1)

我建议您为标签使用自定义视图,您可以在其中指定包含标签图像的RelativeLayout,红色通知指示符以及可用于设置通知指示符内的数字的文本视图。以下是为标签使用自定义布局的方法的一个示例:https://mobikul.com/make-custom-tabs-icons-android/

答案 1 :(得分:0)

您可以使用水平线性布局,其中标签图像用作标签布局。您可以通过获取viewpager的位置来自己处理添加的图像视图的每次点击,反之亦然。 那样..你可以设计你想要的任何标签布局。 希望有所帮助