I have put two linear layouts, under the first linear layout I have put the "textview" and In the second one I have put "imageview". But the problem is that image view is not moving, I want that dice icon in the centre. Whenever I try to drag that icon it gets stucked at the top left corner of the layout.
I can't figure out what's going wrong as I am new to android.
Have a look at the screenshot
https://i.stack.imgur.com/SJmEY.png
activity_main.xml
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="#string/Logo"
android:textAlignment="center"
android:textColor="#ffffff"
android:textSize="36sp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="#drawable/five" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
MainActivity.java
package com.example.snakes;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
You cannot drag elements in a LinearLayout. They are placed in the order they are declared in the layout file, depending on the orientation set (either horizontally or vertically).
There is also no reason to have two linear layouts like this in your case. You can place both of your elements inside of the first one, and use the gravity property to center the image view (ex. gravity = "center_vertical").
EDIT:
I ended up trying it myself, and resolved it using a RelativeLayout inside a LinearLayout. Make sure the RelativeLayout matches the parents width and height, then center the ImageView inside of the RelativeLayout, like so:
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".MainActivity">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center_vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/someImage"
android:orientation="vertical"
android:layout_centerInParent="true"/>
</RelativeLayout>
</LinearLayout>
You need to add to the second linear layout - constraints statements. I can't recall the exact name of them but I think It's something like "layout_constraintTop_toBottomOf". this should make them constraint. then if you want you can determine the gap and adjust the view.
Related
I have this activity where I have a RecyclerView but above it I have a TextView, now when I scroll in the RecyclerView the RelativeLayout with the text stays at the top of the screen and doesn't scroll with it. Now my problem is that the RelativeLayout view is transparent so when I scroll in the RecyclerView the text in the RelativeLayout will lay on top of the list of text elements in the RecyclerView, in other words to simplify what I mean, I have "text on text" if that makes sense. How can I either have the RelativeLayout not be transparent so that the RecyclerView items scroll "behind" it and aren't visible "underneath" the TextView or how would I be able to make the whole layout scroll together with the RecyclerView?
(Even if I change the background color of the RelativeLayout the text in the RecyclerView will be visible through it)
Here is the XML for this activity:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Activity"
android:background="#drawable/gradient_background">
<RelativeLayout
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintStart_toStartOf="parent"
android:background="#color/colorPrimary">
<View
android:id="#+id/lineView"
android:layout_width="30dp"
android:layout_height="0.5dp"
android:background="#drawable/divider_line"
android:layout_centerVertical="true"/>
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="24sp"
android:layout_toEndOf="#id/lineView"
android:layout_margin="8dp"/>
</RelativeLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="16dp"
app:layout_constraintTop_toBottomOf="#+id/relativeLayout"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Use NestedScrollView to make whole view scrollable
<?xml version="1.0" encoding="utf-8"?>
<androidx.core.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:fillViewport="true"
tools:context=".Activity"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="#drawable/gradient_background">
<RelativeLayout
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary">
<View
android:id="#+id/lineView"
android:layout_width="30dp"
android:layout_height="0.5dp"
android:background="#drawable/divider_line"
android:layout_centerVertical="true"/>
<TextView
android:id="#+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="24sp"
android:layout_toEndOf="#id/lineView"
android:layout_margin="8dp"/>
</RelativeLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="16dp"/>
</LinearLayout>
</androidx.core.widget.NestedScrollView>
Can I have the RelativeLayout not be transparent so that the
RecyclerView items scroll "behind" it?
Just change the Constraint Layout to Linear Layout.
How would I be able to make the whole layout scroll together with the
RecyclerView?
Logic: For that you would have to include the Relative layout in the XML file where you are inflating the RecyclerView content. Now that would inflate the Relative Layout every time right.
So to overcome this problem, whatever you are passing in the RecyclerView constructor, take a flag/count, only inflate the Relative Layout when count is equal to zero/ set the flag and when the count is greater than 0 or if flag is set, then hide the Relative Layout.
That way you would have Relative Layout scroll with the RecyclerView content and inflated only once.
I tried to do many things: set alpha value, set background:transparency, set backgroud different colors like "#90000000", I even created another view with transparency above my reciclerView. But I always have one result:
(do not look at white pictures, I will set them later)
And I need transparency like that one:
So as you see image and line are not under transparency. Do you have any ideas how fix it?
I think you declare the RecyclerView in the front of root,
if you are using a RelativeLayout like a main View in the xml layout, you have to make sur that your transparent View below your RecyclerView, this is an example:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="match_parent">
<RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent">
</RecyclerView>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#9A000000">
</FrameLayout>
you can define two image view and first set the background your image and for secondly set the other background.but you must set the same size.
You can show a overlay above this recyclerview. Just like this.
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<RecyclerView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#55000000"
android:translationZ="100dp"/>
</androidx.constraintlayout.widget.ConstraintLayout>
LinearLayout works as overlay
I know this is a common question , but I am completely messed with those different examples and tutorials available on the web.
I have a horizontalScrollView where I add some view dynamically , and I want to set a guestureListener for swiping through the Views . Each view's with is equal to the width of the screen.
You can use the View Pager instead of the horizontalScrollView. http://developer.android.com/reference/android/support/v4/view/ViewPager.html
To keep the View pager at half the screen use something like this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/White"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1.5">
<android.support.v4.view.ViewPager
android:id="#+id/pagerPromo"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/indicatorPromo"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:padding="5dp"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1.0"
android:orientation="vertical">
This View Pager has a circle indicator at the bottom but you can remove that if you like. Just play around with the weights and see what works best for you.
I have a single activity with a simple layout (a bunch of coloured panels) and I'm trying to overlay a small moving graphic on a transparent view over the top. Like #umar here I'm following this tutorial but my overlay view is refusing to be transparent. I can make the view appear, it contains just what it should, but the background of the view is black and however I try to make it transparent fails. I've tried a few of the solutions mentioned on SO and it always comes out the same.
My layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/everything"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#00ffffff"
>
<LinearLayout
android:id="#+id/row_1_bg"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal"
>
<FrameLayout
android:layout_height="fill_parent"
android:layout_width="100dp"
>
<LinearLayout
android:id="#+id/row_1_table"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#808080"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal"
>
<TextView
android:id="#+id/row_1_pantone"
android:paddingLeft="6dip"
android:textColor="#f0f0f0"
android:textStyle="bold"
android:gravity="center_vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
</TextView>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal"
>
<TextView
android:id="#+id/row_1_rgb"
android:paddingLeft="6dip"
android:textColor="#f0f0f0"
android:textStyle="bold"
android:gravity="center_vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
</TextView>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1"
android:orientation="horizontal"
>
<TextView
android:id="#+id/row_1_hex"
android:paddingLeft="6dip"
android:textColor="#f0f0f0"
android:textStyle="bold"
android:gravity="center_vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
</TextView>
</LinearLayout>
</LinearLayout>
</FrameLayout>
</LinearLayout>
<LinearLayout
android:layout_height="fill_parent"
android:layout_width="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:paddingRight="5px"
android:paddingTop="5px"
android:paddingLeft="5px"
android:gravity="bottom"
android:orientation="vertical"
android:background="#00808080">
<barry.pantone.TransparentPanel
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:id="#+id/transparent_panel"
android:paddingRight="5px"
android:paddingTop="5px"
android:paddingLeft="5px"
android:paddingBottom="5px"
android:background="#00808080">
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id="#+id/button_click_me"
android:text="Click Me!"
/>
</barry.pantone.TransparentPanel>
</LinearLayout>
</LinearLayout>
My TransparentPanel.java is straight from the tutorial, using:
innerPaint.setARGB(225, 75, 75, 75);
to make a transparent panel, and this is my onCreate from the main activity:
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
Resources res = getResources();
sPantone = res.getStringArray(R.array.pantone); // gets colour definitions
iHeight = getWindowManager().getDefaultDisplay().getHeight();
PopulateTable (); // draws colours in the various layout elements
}
The problem is that whatever I do inside the view is fine - I can draw a semi transparent panel over other elements in that view, but the overlay view itself has a black background which obscures the layout beneath. If anyone can help me understand why transparency doesn't work, I will be eternally grateful.
Many thanks
Baz
EDIT
Following another idea I tried moving the definition of the overlay out into its own XML file and using a LayoutInflater to inflate and add the new view. Nope. Exactly the same - the additional view has a solid background. Here's the tranny.xml layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:background="#80000040"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android"
android:paddingRight="5dip"
android:paddingTop="5dip"
android:paddingLeft="5dip"
android:gravity="bottom"
android:orientation="vertical"
>
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:id="#+id/button_click_me"
android:text="Click Me!"
/>
</LinearLayout>
and here's the code from onCreate to inflate the new view and add it to the main layout:
private View view;
ViewGroup parent = (ViewGroup) findViewById(R.id.everything);
view = LayoutInflater.from(getBaseContext()).inflate(R.layout.tranny, parent, false);
parent.addView(view);
Basically I've gone about creating exactly the same result using a different technique. Handy to learn about LayoutInflater for the first time, but no help re transparency :(
OK, no answers so I'm assuming there's no way to use parent.addView(view) to add an overlaid view which has a transparent background. I had hoped to add a narrow transparent view over the right hand edge of my layout (a scrollbar) into which I could draw a bitmap indicating the position in the big list of displayed items.
Instead I have now made my whole layout slightly narrower and left room for a narrow LinearLayout down the right edge, which has a black background, and into that I draw my bitmap, so I get this:
I would have preferred to put the pointer over the top of the blocks of colour, but unless some guru in the future finds this question and shows us how to do it, I'm close enough.
Baz.
I can draw a semi transparent panel over other elements in that view
Exactly this. You need the "transparency" to be overlaying what's behind it.
The transparency is likely working, but the parent layout's background is transparent (#00ffffff), so the background of the overlay looks black.
Change your root layout's background and you'll likely see that the transparency is working.
If you want it overlay the other elements of your view, you need the transparency as a child to that section of the layout. The way it's currently laid out is like:
<App>
<Content>
</Content>
<Overlay>
</Overlay>
</App>
Whereas you need:
<App>
<Content>
<Overlay>
</Overlay>
</Content>
</App>
If you look at the source for that tutorial you're following, you'll see the custom transparent panel is a child of the MapView, not the root application view. This is why it's able to overlay the MapView content.
I tried all afternoon to get the minHeight attribute to work.
What I want is the linearMe layout to:
Stretch from the bottom of the screen to the bottom of the ListView when the ListView has just a few elements.
I need to be able to fill the linearMe layout with a picture for example.
As the ListView gets bigger I want the linearMe layout to:
Have a fixed height (while being at the bottom of the screen) and the ListView to allow scrolling.
My problem is that the the linearMe layout is smaller and smaller as there is more elements in the ListView. And when there is enough element for the listView to fill the screen, the linearMe layout is just gone. It looks like the minHeight is useless in this case.
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent" >
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:id="#+id/linearMe"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#FF0000"
android:minHeight="200dp" />
</LinearLayout>
I hope you can help me out ! :)
Add android:layout_weight="1" to the ListView as well.
Change them both (list & linearMe) android:layout_height attribute to "match_parent"
Remove `minHeight.
That way each View will take half of the screen.`
You might want to try your spacer layout using "View" instead of "LinearLayout". The ViewGroup classes sometimes handle layouts slightly differently.
If you are willing to use ConstraintLayout as the parent container, the following xml should serve your purpose:
<androidx.constraintlayout.widget.ConstraintLayout 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:layout_width="match_parent"
android:layout_height="match_parent">
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constrainedHeight="true"
app:layout_constraintBottom_toTopOf="#id/linearMe"
app:layout_constraintTop_toTopOf="parent"
tools:listitem="#android:layout/list_content" />
<LinearLayout
android:id="#+id/linearMe"
android:layout_width="match_parent"
android:layout_height="0dp"
android:background="#FF0000"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/list"
app:layout_constraintHeight_min="200dp"
android:orientation="vertical"
/>
</androidx.constraintlayout.widget.ConstraintLayout>
What I've done is that I've defined constraints to chain both list and linearMe with each other. app:layout_constraintHeight_min="200dp" will ensure minimum height of 200dp for linearMe. app:layout_constrainedHeight="true" makes sure that when list has more items, it doesn't hide behind linearMe.
I couldn't test it with some data to fill the ListView. You can just try it out and post your feedback here.