Android: LinearLayout Rearranged when updating views - android

I'm having a problem with a LinearLayout in an app i'm working on. The linear layout is vertical. There are several items in the layout including a TextView, a vertical SeekBar, and an ImageView.
Whenever I update the textView (ie setText()) my layout rearranges. The ImageView goes from being at the bottom to being in the middle. Same thing happens if I replace the drawable in the ImageView.
I assume I have something wrong with how I am specifying my layout. This is the portion having problems:
<modrobotics.code.ui.BlockValueSliderView
android:id="#+id/sliderSix"
android:layout_width="0dp"
android:visibility="gone"
android:layout_height="fill_parent"
android:layout_marginBottom="-12dp"
android:layout_weight="1"
android:orientation="vertical" >
<TextView
android:id="#+id/BVLabel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center_horizontal"
android:paddingTop="12dp"
android:text="64"
android:textColor="#000"
android:textSize="20sp" >
</TextView>
<View
android:id="#+id/circle1"
android:layout_width="6dp"
android:layout_height="6dp"
android:layout_gravity="center"
android:layout_marginBottom="-6dp"
android:background="#drawable/circle"
android:gravity="center_horizontal"
android:padding="0dp" />
<LinearLayout
android:id="#+id/controlElementList12"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:padding="0dp" >
<modrobotics.code.ui.VerticalSeekBar
android:id="#+id/slider"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="bottom|center_horizontal"
android:layout_marginBottom="-20dp"
android:layout_weight="20"
android:padding="0dp"
android:progressDrawable="#drawable/seekbar_progress"
android:thumb="#drawable/seekbar_thumb"
android:thumbOffset="-1dp" />
<ImageView
android:id="#+id/logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginBottom="-20dp"
android:layout_marginTop="-20dp"
android:layout_weight="1"
android:padding="0dp"
android:src="#drawable/on6" >
</ImageView>
</LinearLayout>
</modrobotics.code.ui.BlockValueSliderView>
EDIT:
I have tried the suggestions mentioned below to no avail. I have removed all negative margins, simplified the layout by removing unnecessary LinearLayout, gotten rid of GONE, fixed height for images etc... I'm starting to believe the problem is greater than just this.
I'm using a single Activity with a PageAdapter. It seems I'm not using PageAdapter correctly. startUpdate() is being called over and over again. Any static global variables I have seem be cleaned up or on separate threads some how. I believe these problems may all be linked. Perhaps I don't full understand the threading model when using a PageAdapter.

In 'modrobotics.code.ui.BlockValueSliderView' change the visiblity from GONE to INVISIBLE. It's possible that the layout elements will re-arrange whenever you change the visibility programatically from GONE to VISIBLE of this View because while the View is set to be GONE, it doesn't occupy any space in the layout and rest of the Views are placed in the layout just taking its space. If it's GONE, It behaves like it doesn't exist in the layout. Then, when you sets this view to be VISIBLE, it switches rest of the Views in the layout to prepare a space for itslef.

This turned out to be a problem related to the VerticalSeekBar implementation I was using.
I was rotating the thumb for the seekbar, and also calling bringToFront() on the seekbar. The combination of these two calls caused elements to be rearranged. Not to sure why, but removing these two lines of code fixed my problems.

Related

Relativelayout position view between two views

so I'm currently working on an app on Android, and I got stuck on a specific problem regarding the RelativeLayout, which I can't find a way to solve.
I have in the layout three views as follows: TextView, Textview and ImageView (laid horizontally), here is a screenshot of the ios counterpart:
the Textview at the middle should stick to the first one, until he gets to the Imageview, when he does, he keeps his minimum size (wrap content), while the first Textview truncate.
On IOS I setted priorities to the constraint to accomplish this, but I can't figure out how to solve this on Android.
Here what I tried:
<android.support.percent.PercentRelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#drawable/daily_movie_title_box">
<TextView
android:id="#+id/daily_header_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="15dp"
android:text="New Text aawi oa ioawfwi"
android:textSize="16sp"
android:textStyle="bold"
android:textColor="#color/white"
android:lines="1"
android:singleLine="true"
android:layout_alignParentStart="true"
/>
<TextView
android:id="#+id/duration_text"
android:text="138 mins"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:textSize="13sp"
android:textColor="#color/white"
android:lines="1"
android:layout_alignBaseline="#id/daily_header_textview"
android:layout_toStartOf="#+id/certification_icon"
android:layout_toEndOf="#id/daily_header_textview"
/>
<ImageView
android:id="#id/certification_icon"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:src="#drawable/uk12a"
android:layout_alignBottom="#id/daily_header_textview"
app:layout_aspectRatio="100%"/>
</android.support.percent.PercentRelativeLayout>
Which resulted in this (which is what I want):
But when I increase the first Textview text it's not behaving as I desire...
Is it possible to achieve the behaviour I want in Android (keep the middle Textview wrap content, and truncate the first one if needed)?
I will post an update if I find a solution eventually, just wanted to see if anyone can find an easy way to achieve this behaviour, as I suspect there is.
Thanks.
From my understanding, you want the first TextView to be as large as possible, without adding space after the text if the text is too small. The second TextView should only wrap_content, but it should fill the rest of the parent layout when the row doesn't. The ImageView is set to wrap_content.
I tested it with this layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:shrinkColumns="0"
android:stretchColumns="1">
<TableRow>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="Shrinking text dddddddddddddddddddddd"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Midle column"/>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher"/>
</TableRow>
</TableLayout>
</LinearLayout>
The only problem is that if the second column has a incredibly large text, it will push the other views out of the parent. But in your case, I don't think that will be a problem. Otherwise, I think it does the job.
These are some suggested solutions:
You can use LinearLayout with horizontal orientation and weight for each component (TextViews and ImageView).
You can set the minimum and maximum text length for the second TextView.
But i prefer to apply the first solution. You can assign a weight for each component ( amount of space on the screen ) using:
android:layout_height

Cannot independently set padding on TextViews

While testing some designs for a LinearLayout for the elements in a ListView, I stumbled upon some weird behaviour. As you can see in the added code, I have three TextViews in a horizontal LinearLayout. I wanted to set the padding for one of these TextViews, but it seems that this value is also applied to the other TextViews as a margin of some sort (see pictures).
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="48dp">
<TextView
android:id="#+id/search_list_row_symbol"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:paddingTop="0dp"
android:layout_marginTop="0dp"
android:textSize="16sp"
android:background="#android:color/holo_blue_light"
android:text="O"/>
<TextView
android:id="#+id/search_list_row_name"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:paddingTop="0dp"
android:layout_marginTop="0dp"
android:textSize="16sp"
android:background="#android:color/holo_red_light"
android:text="oxygen"/>
<TextView
android:id="#+id/search_list_row_number"
android:layout_width="wrap_content"
android:layout_height="20dp"
android:paddingTop="0dp"
android:layout_marginTop="0dp"
android:textSize="16sp"
android:background="#android:color/holo_green_light"
android:text="8"/>
</LinearLayout>
Set android:paddingTop="0dp" on all TextViews
Set android:paddingTop="16dp" only on first TextView
Do any of you know why the padding cannot be set independently on one of these TextViews?
The behavior seems correct as padding is applied to the content of a view - not to the view itself. However, the remaining child views following the padding from first child view seems erroneous.
As an alternate, I would suggest you to replace paddingTop with layout_marginTop and it should work fine.
Because you have given padding to only one text view. If you want all text view than you will have to keep all three within one LinearLayout and set property i.e setPadding() or setPaddingTop().
I think this might help you.

TableLayout not centered vertically

I have a TableLayout inside a RelativeLayout with android:layout_centerInParent="true" as one of its attributes, but it is not being centered vertically.
Here is my xml:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/line_drawing_relativelayout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TableLayout
android:id="#+id/activity_linking_tl"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<TableRow
android:id="#+id/table_row_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="1dp" >
<com.xx.myview
android:id="#+id/id_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<com.xx.myview
android:id="#+id/id_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</TableRow>
</TableLayout>
<ImageButton
android:id="#+id/line_drawing_b_restart"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:padding="22dp"
android:src="#drawable/ic_restart" >
</ImageButton>
<!-- There are more views/widgets here -->
</RelativeLayout>
How would I solve this?
Are you sure that the RelativeLayout is taking up as much space as you think? It might be that the TableLayout is centered, but that the RelativeLayout is wrapping content, so it ends up being centered but in a smaller container than you expected. It's hard for me to gauge without seeing the RelativeLayout portion of the XML.
One way to check your layouts is to use the developer option "show layout bounds":
It will give you a better idea of how your layouts are being constructed. If you are running an older phone without this developer option, I would just start setting flat colors for View backgrounds (e.g. android:background="#F00").
Try setting parent RelativeLayout width and height to match_parent.
and add this to your TableLayout
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
The problem was that I had android:layout_below="xxx" as well (for some reason not shown in the code I posted), which overrode the centering I was trying to achieve. Removing this solved it. Obvious really.

Set Android View to Invisible/Gone Not Working

I have a surfaceview for which im putting a camera preview onto. On top of that, I have a relative layout that has a bunch of views, like a scan button, etc.
I am trying to make one of these views invisible, like this
myIcon.setVisibility(View.INVISIBLE);
And I have also tried
myIcon.setVisibility(View.GONE);
Neither seems to be working. Invisible doesn't work at all, and Gone sort of works
Here you can see a 2D icon, a settings button. Before hiding, it looks like this:
Then I call setVisibility(View.GONE)
You can clearly see that the linearlayout that holds those views responded by giving the settings button more space, but it didnt remove the 2D from behind it. I think it has something to do with the SurfaceView, because I know this would normally work.
I have tried
myIcon.requestFocus();
After I do the change of visibility, but still nothing.
Any suggestions? Please only respond if you have some experience with this particular problem
Edit:
Here is my layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<com.sample.SampleJavaCameraView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:visibility="gone"
android:id="#+id/cv_surface_view" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true">
<ImageView
android:id="#+id/myIcon"
android:layout_width="30dip"
android:layout_height="30dip"
android:src="#drawable/twod_icon"
/>
<ImageButton
android:id="#+id/settingsBtn"
android:layout_width="30dip"
android:layout_height="30dip"
android:src="#drawable/settings_gear"
android:background="#null"
/>
</LinearLayout>
<ImageButton
android:id="#+id/scan_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/logo_small"
android:background="#drawable/blue_radial_grad"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:padding="20dip"
/>
Here you can see the images im trying to hide are wrapped in a linear layout. The surfaceview is at the top, it is the OpenCV wrapped class for a SurfaceView
maybe try myIcon.bringToFront();

View overlapping with RelativeLayout on Android 1.5

I am having a problem with views overlapping in a RelativeLayout on Android 1.5... Everything is working fine on Android 1.6 and above.
I do understand that Android 1.5 has some issues with RelativeLayout, but I was not able to find anything on StackOverflow or the android beginners group for my specific problem.
My layout consists of four sections, each of which are made up of a TextView, a Gallery, and another TextView aligned vertically:
Running Apps
Recent Apps
Services
Processes
When all four sets of these items are displayed everything works fine. However, my app allows the user to specify that some of these are not displayed. If the user turns off Running Apps, Recent Apps, or Services then the remaining sections all of a sudden overlap eachother.
Here is my code for the layout. I'm not sure what I am doing wrong. When the user turns off display of a section I use the View.GONE visibility setting:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_vertical"
android:layout_gravity="center_vertical"
android:background="#null"
>
<!-- Running Gallery View Items -->
<TextView
style="#style/TitleText"
android:id="#+id/running_gallery_title_text_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:paddingLeft="1sp"
android:paddingRight="10sp"
android:text="#string/running_title"
/>
<Gallery
android:id="#+id/running_gallery_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/running_gallery_title_text_id"
android:spacing="5sp"
android:clipChildren="false"
android:clipToPadding="false"
android:unselectedAlpha=".5"
/>
<TextView
style="#style/SubTitleText"
android:id="#+id/running_gallery_current_text_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/running_gallery_id"
android:gravity="center_horizontal"
/>
<!-- Recent Gallery View Items -->
<TextView
style="#style/TitleText"
android:id="#+id/recent_gallery_title_text_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/running_gallery_current_text_id"
android:gravity="left"
android:paddingLeft="1sp"
android:paddingRight="10sp"
android:text="#string/recent_title"
/>
<Gallery
android:id="#+id/recent_gallery_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/recent_gallery_title_text_id"
android:spacing="5sp"
android:clipChildren="false"
android:clipToPadding="false"
android:unselectedAlpha=".5"
/>
<TextView
style="#style/SubTitleText"
android:id="#+id/recent_gallery_current_text_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/recent_gallery_id"
android:gravity="center_horizontal"
/>
<!-- Service Gallery View Items -->
<TextView
style="#style/TitleText"
android:id="#+id/service_gallery_title_text_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/recent_gallery_current_text_id"
android:gravity="left"
android:paddingLeft="1sp"
android:paddingRight="10sp"
android:text="#string/service_title"
/>
<Gallery
android:id="#+id/service_gallery_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/service_gallery_title_text_id"
android:spacing="5sp"
android:clipChildren="false"
android:clipToPadding="false"
android:unselectedAlpha=".5"
/>
<TextView
style="#style/SubTitleText"
android:id="#+id/service_gallery_current_text_id"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/service_gallery_id"
android:gravity="center_horizontal"
/>
</RelativeLayout>
I ommitted the xml for the Processes section in a (somewhat vain) attempt to keep this shorter...
What can I do to make this work in Android 1.5? I don't think it is just a matter of reordering the views in the xml because it works fine when everything is displayed.
Two possible solutions:
Try setting the element's height to 0 or 1 px and visibility to INVISIBLE instead of GONE.
Wrap each Gallery/TextView in a LinearLayout set to wrap_height, and set the above/belows on the layouts instead of the subviews. Then set the subelements to View.GONE, leaving the linear layouts used for the relative positioning still visible but with wrapped height 0.
The idea with either solution is to make sure you're never positioning something relative to a view that's View.GONE; I'd suspect that's the source of the bug you're running into.
If I may ask, though... why do you even need to use a RelativeLayout here at all? From what I can see at a glance, everything here would fit fine into a vertical LinearLayout, and in fact seems to be conceptually simpler for this arrangement.

Categories

Resources