Please read the question fully before answering!
Suppose I have two views:
first
(yellow) in the bottomsecond
(cyan) filling the rest of the view abovefirst
The size of the parent view is dynamic.
How can I achieve the below Expected column UI when the parent height is dynamically set to the values in the first column? Notice how the partially visible view is just hidden instead of cropped.
Constraints
- Any code is not a possibility, I know it's possible to solve the problem with:
second.setVisibility(second.getHeight() < SECONDS_PREFERRED_SIZE? GONE : VISIBLE)
but I don't have access togetHeight()
so the solution must be bare xml.
It can be relaxed to code only writing UI state viaRemoteViews
. - Based on the above no custom views are allowed, not even libraries, just basic layout managers:
FrameLayout
,LinearLayout
,RelativeLayout
,GridLayout
or as a last resort one of the advanced ones:
ViewFlipper
,ListView
,GridView
,StackView
orAdapterViewFlipper
- The
layout_width
andlayout_height
is dynamic
In the example I fixed it so it's easy to try out different variations. The above image is thelayout_height
changed to the displayed value simulating the possibilities I want to handle. - I used
TextView
, but it should be generally applicable to anyView
- Observant people may have noticed that the above constrains the solution to Home screen app widgets with
RemoteViews
.
Tries
I tried implementing with RelativeLayout
and LinearLayout
, but they both behave as the Actual column on the picture.
RelativeLayout
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="64dp" (actually fill_parent, but fix it for sake of simplicity)
android:layout_height="fill_parent" (first column on picture)
android:layout_gravity="center"
android:background="#666"
tools:ignore="HardcodedText,RtlHardcoded"
>
<TextView
android:id="@+id/first"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:background="#8ff0"
android:text="First"
/>
<TextView
android:id="@+id/second"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="@id/first"
android:background="#80ff"
android:text="Second"
android:gravity="center"
/>
</RelativeLayout>
LinearLayout
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="64dp" (actually fill_parent, but fix it for sake of simplicity)
android:layout_height="fill_parent" (first column on picture)
android:layout_gravity="center"
android:background="#666"
android:orientation="vertical"
tools:ignore="HardcodedText,RtlHardcoded"
>
<TextView
android:id="@+id/second"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#80ff"
android:text="Second"
android:gravity="center"
/>
<TextView
android:id="@+id/first"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_gravity="right"
android:background="#8ff0"
android:text="First"
/>
</LinearLayout>