如何设计水平滚动的自定义视图

Question

How to design this kind of view, it should be horizontally scrollable and fall in the range of that week bar also

Answer 1

If you are using the LinearLayout as match_parent then don't get the layout width. Use wrap_content . If its don't work then set the fixed size for your image.

<HorizontalScrollView android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="15dp"
    android:layout_marginBottom="2dp"
    android:fillViewport="true"
    android:orientation="horizontal"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <LinearLayout
        android:id="@+id/lyt_items"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/iv_icon1"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:contentDescription="@string/app_name"
            android:layout_marginRight="1dp"
            android:src="@mipmap/ic_launcher" />
        <ImageView
            android:id="@+id/iv_icon2"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:contentDescription="@string/app_name"
            android:layout_marginRight="1dp"
            android:src="@mipmap/ic_launcher" />
        <ImageView
            android:id="@+id/iv_icon3"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:contentDescription="@string/app_name"
            android:layout_marginRight="1dp"
            android:src="@mipmap/ic_launcher" />
    </LinearLayout>
</HorizontalScrollView>

Update: if you want to generate this view dynamically then follow these steps

1) put this layout where you want to view this scroll able functionality

<LinearLayout
                android:layout_width="0dp"
                android:layout_height="70dp"
                android:layout_weight="1">

                <HorizontalScrollView
                    android:id="@+id/horizontal_scrollview"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_marginBottom="2dp"
                    android:layout_marginTop="2dp"
                    android:scrollbars="none">

                    <LinearLayout
                        android:id="@+id/image_layout"
                        android:layout_width="72dp"
                        android:layout_height="match_parent"
                        android:gravity="center"
                        android:orientation="horizontal" />
                </HorizontalScrollView>

            </LinearLayout>

2) make custom layout which want to show in Scrollbar

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="72dp"
    android:layout_height="70dp"
    android:background="@drawable/circle_selector"
    android:gravity="center"
    android:orientation="vertical">

    <RelativeLayout
        android:id="@+id/image_alert_icon_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="3dp"
        android:layout_marginRight="3dp"
        android:background="@drawable/circle_selector">

        <ImageView
            android:id="@+id/imageView_device"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:scaleType="fitCenter"
            android:src="@drawable/ic_fences" />

    </RelativeLayout>

    <TextView
        android:id="@+id/name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:maxLength="10"
        android:text="name"
        android:textColor="@color/white"
        android:textSize="12sp" />
</LinearLayout>

3) Use this java code to generate views at runtime

private void addImagetoLayout( {
        imageLayout.removeAllViews();

        for (int i = 0; i < list.size(); i++) {
            View view = getLayoutInflater().inflate(R.layout.image_layout, null);
            RelativeLayout imageAlertLayout = (RelativeLayout) view.findViewById(R.id.image_alert_icon_layout);
            ImageView imageView = (ImageView) imageAlertLayout.findViewById(R.id.imageView_device);
            TextView name = (TextView) view.findViewById(R.id.name);
            // set image in imageView
       // set text in text View
            imageLayout.addView(view);

        }

    }