How to use ScrollView inside RelativeLayout for Android? - java

I am trying to add multiple TextViews dynamically to my RelativeLayout, and while this works, when the screen is filled with text, the scrolling does not kick in. Any ideas on how to make it scroll-able?
It looks like this: https://imgur.com/a/a7AnOQV (also, while we're at it, how can I make the fab buttons be 0% transparent? i dont understand why u can see through the buttons the text) :(
One way I tried to make it work was to make ScrollView the parent layout (but it would push my buttons on the top side of the screen), but scrolling worked (but idk how to push the buttons back on the bottom of the screen) and also tried other answers found on Stackoverflow, but none seemed to help me. I tried the whole day to fix this goddamn Scroll.
XML Code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/relativeLayoutId"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".PostDataFragment">
<ScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:fillViewport="true"
android:scrollbars="vertical"
android:id="#+id/scrollViewId">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fillViewport="true">
<TextView
android:id="#+id/row0"
android:layout_width="0dp"
android:layout_height="0dp"
android:text="TextView" />
</RelativeLayout>
</ScrollView>
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinatorLayoutId"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginEnd="16dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:src="#drawable/baseline_add_white_24dp"
app:backgroundTint="#color/colorPrimary"
app:fabSize="normal"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent" />
<LinearLayout
android:id="#+id/pictureLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginEnd="24dp"
android:layout_marginBottom="90dp"
android:orientation="horizontal">
<TextView
android:id="#+id/textView2"
style="#style/TextAppearance.AppCompat.Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:text="New Picture" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabPicture"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:src="#drawable/baseline_insert_photo_white_24dp"
app:fabSize="mini" />
</LinearLayout>
<LinearLayout
android:id="#+id/textLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginEnd="24dp"
android:layout_marginBottom="150dp"
android:orientation="horizontal">
<TextView
android:id="#+id/textView"
style="#style/TextAppearance.AppCompat.Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="5dp"
android:layout_marginRight="5dp"
android:text="New Paragraph" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:src="#drawable/baseline_notes_white_24dp"
app:fabSize="mini"
tools:layout_editor_absoluteX="144dp"
tools:layout_editor_absoluteY="320dp" />
</LinearLayout>
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>
Java Fragment File (inside onCreateView):
parentRLayout = (RelativeLayout) v.findViewById(R.id.relativeLayoutId);
Inside a button listener in the Java Fragment File -> When a button is
clicked, then text is added into a dialog, and when fabText button is
clicked and text is added on the screen -> following line of code:
parentRLayout.addView(createNewTextView(paragraphText.getText().toString(), 0, 5, 5));
//Function that returns a TextView (in the same Java Fragment Class)
TextView createNewTextView(String text, int alignment, int margin, int padding){
TextView newDynamicTextView = new TextView(getActivity());
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT
);
layoutParams.addRule(RelativeLayout.BELOW, currentId);
newDynamicTextView.setLayoutParams(layoutParams);
newDynamicTextView.setId(TextView.generateViewId());
currentId = newDynamicTextView.getId();
Log.d("currentId", ""+currentId);
newDynamicTextView.setText(text);
Log.d("newDynamic:", newDynamicTextView.getText().toString());
return newDynamicTextView;
}
EDIT:
I have managed to make it work. The idea is to have the CoordinatorLayout as the root(parent) layout and inside it a ScrollView that has inside a RelativeLayout. The buttons are outside the ScrollView (under it) so they don't scroll.

My one cent.
It looks like this: https://imgur.com/a/a7AnOQV (also, while we're at it, how can I make the fab buttons be 0% transparent? i dont understand why u can see through the buttons the text)
Please take note that views are drawn based on their order in your xml layout.
Because the tree is traversed pre-order, this means that parents will
be drawn before (i.e., behind) their children, with siblings drawn in
the order they appear in the tree.
https://developer.android.com/guide/topics/ui/how-android-draws

Related

add single button on cardview page

created layout with radio button in a cardview.
needed a single button at bottom but button is repeating with radio button.
below is the code for card view and design
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_marginTop="10dp"
android:layout_height="wrap_content">
<RadioGroup
android:id="#+id/radiogrp_surveyoptions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<RadioButton
android:id="#+id/rd_option1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#color/black"
android:gravity="left"
android:textSize="15dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="10dp"
/>
</LinearLayout>
</android.support.v7.widget.CardView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="center"
android:layout_weight="0.3">
<Button
android:id="#+id/btn_saveans"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15dp"
android:layout_marginLeft="20dp"
android:layout_marginTop="15dp"
android:background="#drawable/buttonclick"
android:text="Save"
android:textColor="#color/whitecolor"
android:textSize="15dp"
android:foregroundGravity="bottom"/>
</LinearLayout>
please guide how i can add only one button after repeated cardview
Instead of inflating layout containing both CardView and Button, for every element in the list, you should move Button to whatever layout you're inflating in onCreate() method. (or onCreateView() if you're using fragments)
So, assuming you're using RecyclerView, move Button to the layout containing your <RecyclerView> component.

Aligning Content in an Android ListView

I apologize for this question may have been asked somewhere, but I'm not sure how to phrase it.
I have a ListView in my Android app and I want to align the content in each row so that each TextView is aligned with corresponding TextViews in rows below it (left, right, and center).
This picture is what I'm going for listview:
So, the left TextView is aligned all the way to the left and the right TextView is aligned all the way to the right. The center TextView is aligned such that it always "begins" at the same place (ie. it's position is not affected by the length of the left TextView).
How can I achieve this? Thanks a lot
use bellow like.. I have used first textview left, second center & third is right. You can change as your wish...
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="3">
<TextView
android:id="#+id/tv_textview"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="left|center_vertical|center_horizontal"
android:text="AAP 500" />
<TextView
android:id="#+id/tv_textview2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center|center_vertical|center_horizontal"
android:text="85.65" />
<TextView
android:id="#+id/tv_textview3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right|center_vertical|center_horizontal"
android:text="-3.75(-3.34 %)" />
</LinearLayout>
You'll want to use a LinearLayout with horizontal orientation then apply a weight to each of the textviews inside of it. this will cause them to each take a certain fraction of the layout. You can start by giving them each a weight of 1 and adjusting from there. The right-most textview will also need a right justification on the text to match the picture.
You have to create custom listView in that your item_row_view.xml will look like this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/tv_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:text="AAP 500"
android:textAlignment="center" />
<TextView
android:id="#+id/tv_textview2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="85.65"
android:textAlignment="center" />
<TextView
android:id="#+id/tv_textview3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="-3.75(-3.34 %)"
android:textAlignment="center" />
</RelativeLayout>

Android RelativeLayout Button above TextView

have 2 text views 1 next to another (using layout_toLeftOf attribute) and I'm trying to place a button above each one of the text views:
1) if I'm using above, alignLeft and alignRight attributes on the button, the button width and height enlarges to fit the size of the text views
2) so I thought of using linear layout so it will fit to the size of the textview , and then place a button with layout_gravity="center", but it's not centered, it's aligned to the left.
Here is the code(its all inside a RelativeLayout):
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#id/countdown_hours_tv"
android:layout_alignLeft="#id/countdown_hours_tv"
android:layout_alignRight="#id/countdown_hours_tv">
<Button
android:layout_width="#dimen/plus_minus_button_size"
android:layout_height="#dimen/plus_minus_button_size"
android:layout_gravity="center"
android:background="#drawable/plus_sign_button"
android:onClick="increaseHourClicked"/>
</LinearLayout>
<Button
android:layout_width="#dimen/plus_minus_button_size"
android:layout_height="#dimen/plus_minus_button_size"
android:layout_below="#id/countdown_hours_tv"
android:layout_alignLeft="#id/countdown_hours_tv"
android:layout_alignRight="#id/countdown_hours_tv"
android:background="#drawable/minus_sign_button"
android:onClick="decreaseHourClicked"/>
Try using FrameLayout for putting one view on top of another, which is in your case a button on top of textView.
Try adding the Button and the TextView inside a LinearLayout with vertical orientation. Something like this:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/layout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView1"
android:layout_gravity="center"/>
</LinearLayout>
<LinearLayout
android:id="#+id/layout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/layout1"
android:orientation="vertical">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView1"
android:layout_gravity="center"/>
</LinearLayout>
</RelativeLayout>

Change TextView align programmatically

My RelativeLayout is like this :
ImageView(arrow back) TextView(title) ImageButton(close button)
the first ImageView is just an arrow
the TextView can change and must stay between the two image
the second ImageView is a close button
I'm trying to change the visibility of the first image to GONE or VISIBLE
For this I need to update the layout param of the TextView, but this is not working properly
Here is my method :
private void setBackButton(boolean visible) {
RelativeLayout.LayoutParams params = (RelativeLayout.LayoutParams) mTitle.getLayoutParams();
if (visible) {
mImageArrowBack.setVisibility(View.VISIBLE);
params.addRule(RelativeLayout.RIGHT_OF, R.id.fragment_back);
} else {
mImageArrowBack.setVisibility(View.GONE);
params.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
}
params.addRule(RelativeLayout.LEFT_OF, R.id.fragment_close);
mTitle.setLayoutParams(params);
}
The arrow back is GONE and VISIBLE with no problem but the textview just stack on it. RIGHT_OF is not working.
Any idea ?
The complete layout :
<RelativeLayout
android:id="#+id/fragment_title_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/fragment_back"
android:layout_width="#dimen/button_favorite"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:src="#drawable/arrow_left" />
<TextView
android:id="#+id/fragment_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_toLeftOf="#+id/fragment_list_country_close"
android:singleLine="true" />
<ImageButton
android:id="#+id/fragment_close"
android:layout_width="#dimen/button_favorite"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="#drawable/close_btn" />
</RelativeLayout>
You don't need to programmatically change the layout params of the TextView, use android:layout_alignWithParentIfMissing="true" instead. RelativeLayout will move the TextView to align it parentLeft when you make the first ImageView GONE.
Write your TextView like this:
<TextView
android:id="#+id/fragment_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/fragment_back"
android:layout_toLeftOf="#+id/fragment_close"
android:layout_alignWithParentIfMissing="true"
android:singleLine="true" />
If this is NOT what you intended and you want the TextView to remain centered when you move the ImageView, then the solution is even simpler: set the ImageView's visibility to INVISIBLE, not GONE.
If you just set your layout like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/fragment_title_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/fragment_back"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher" />
<TextView
android:id="#+id/fragment_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/fragment_back"
android:gravity="center"
android:singleLine="true"
android:text="Title" />
<ImageButton
android:id="#+id/fragment_close"
android:layout_width="50dp"
android:layout_height="match_parent"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
And change the visibility of mImageArrowBack programatically, it will work.
When the ImageView is GONE its layout is not inflated, but the reference to the View is kept. So the TextView aligns to the left of your layout in that case.

Android: Using 2 layouts in one layout

I have some FrameLayout to display overlapping images. Under this FrameLayout I want to display a standard button for some click-action.
To make my work easier, I thought, I can put a new Linear, or Relative, Layout under the FrameLayout - surely all in one LinearLayout.
But this method isn't working for me.
What is the best way to show my button under a whole FrameLayout without putting it in the Layout and managing his position programmaticaly?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<FrameLayout
android:id="#+id/framelayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top|left" >
<ImageView
android:id="#+id/coverimg"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top|left"
android:maxHeight="100dp"
android:minHeight="130dp"
android:minWidth="130dp"
android:src="#drawable/cover_img" />
<ImageView
android:id="#+id/imageView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginLeft="100dp"
android:src="#android:drawable/ic_media_play" />
<ProgressBar
android:id="#+id/progressBar1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:visibility="gone" />
</FrameLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:text="Button" />
</LinearLayout>
</LinearLayout>
first to say:
your orientation of the first LinearLayout is wrong. You should use vertical instead of horizontel, cause it would show the button right of your images and not below.
second:
no nead to wrap the button into another LinearLayout, cause it's a sinlge item and attached to your first LinearLayout.
third:
to set the button on another 'place', give your top LinearLayout an ID like 'android:id="#+id/myLinear"' and then use following code:
LinearLayout myLinear = (LinearLayout)this.findViewById(R.id.myLinear);
LayoutParams lp = new LinearLayout.LayoutParams(Gravity.CENTER);
myLinear.setLayoutParams(lp);
maybe this will work to:
LinearLayout myLinear = (LinearLayout)this.findViewById(R.id.myLinear);
myLinear.setLayoutParams(new LinearLayout.LayoutParams(Gravity.CENTER));
Hope i could help you?
First you change Linear layout orientation to vertical, and second no need to use another
layout u can put button directly
Ex: android:orientation="vertical"

Categories

Resources