Android - SlidingPaneLayout - set width on the Pane - android

I'm using a SlidingPaneLayout in my activity:
<android.support.v4.widget.SlidingPaneLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/myslidingpanelayout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- menu left -->
<LinearLayout
android:id="#+id/menu"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#8d305f"
android:orientation="vertical" >
...
</LineareLayout>
<!-- main page right-->
<LinearLayout
android:id="#+id/right_main"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="#fff"
android:orientation="vertical" >
...
</LineareLayout>
</android.support.v4.widget.SlidingPaneLayout>
I want the menu to cover 3/4 of the page I want it to work on all the phones so I can't put for example
android:layout_width="300dp"
I want to calculate the screen width and set it to the left pane
Thank for your help

Thanks for you all I found this answer and it works with me:
int width;
int height;
if (android.os.Build.VERSION.SDK_INT >= 13){
Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
width = size.x;
height = size.y;
}else {
Display display = getWindowManager().getDefaultDisplay();
width = display.getWidth(); // deprecated
height = display.getHeight(); // deprecated
}
if(width>0&&height>0){
LinearLayout layout = (LinearLayout)findViewById(R.id.menu);
// Gets the layout params that will allow you to resize the layout
LayoutParams params = layout.getLayoutParams();
// Changes the height and width to the specified *pixels*
params.height = height;
params.width = width*3/4;
}

Just looking up the doc for sliding pane, looks like it functions like a linear layout, and can use the
layout_weight
parameter to set a percentage based width since the parent viewgroup is match_parent
In the case of 3/4 = 75% you can
android:layout_weight="0.75"
From the android docs http://developer.android.com/reference/android/support/v4/widget/SlidingPaneLayout.html:
Like LinearLayout, SlidingPaneLayout supports the use of the layout parameter layout_weight on child views to determine how to divide leftover space after measurement is complete. It is only relevant for width. When views do not overlap weight behaves as it does in a LinearLayout.
When views do overlap, weight on a slideable pane indicates that the pane should be sized to fill all available space in the closed state. Weight on a pane that becomes covered indicates that the pane should be sized to fill all available space except a small minimum strip that the user may use to grab the slideable view and pull it back over into a closed state.
And from the LinearLayout docs http://developer.android.com/guide/topics/ui/layout/linear.html#Weight
Note: You will end up setting the layout_width parameter to 0dp since the view group will actually use the weight to lay the children out

Apart from Selecsosi's answer, which is correct, there is also this view I wrote to always display the second item as a pane (ignoring the default show-side-by-side-if-the-fit behaviour). It can, as the name shows, wrap around the sliding view.
You can implement the behaviour you're after by either using a lot of #dimen resources and switching them based on swXXXdp-(port|land) or just setting the sliding view's width at runtime (something I'm reasonably certain you can do with the default layout as well).

Related

dynamically set height of view behind BottomSheet to fill space above sheet

I'm trying to correctly set the height of the view (mapfragment in below example) that normally sits behind the BottomSheet.
I want the bottom sheet to persist in a half-open state with the option to expand to full screen, but not fully collapse. Example of desired functionality on the two right screens of these uber examples. To do this I set the peek height to half the screen width and the mapfragment height to half and that kinda worked
// Get bottom nav height
var navBarHeight = 0
val navBarId = resources.getIdentifier("navigation_bar_height", "dimen", "android")
if (navBarId > 0) {
navBarHeight = convertDpToPixel(resources.getDimensionPixelSize(navBarId))
}
// Set bottom sheet "persisted" open height
val metrics = resources.displayMetrics
bottomSheetBehavior.peekHeight = metrics.heightPixels / 2
// programmatically set map height
val params = mapFragment?.view?.layoutParams
params?.height = (metrics.heightPixels / 2) - navBarHeight
mapFragment?.view?.layoutParams = params
However, there's an issue as shown in this screenshot - fragment height mismatch - where the "Google" logo and "locate me" button on the map are slightly covered due to some insets not being accounted for.
I'm assuming I have to dynamically account for the insets and bottom nav to get the correct height. This just seems rather error prone though considering the varying sizes of those across devices and versions. I have to imagine there's a better way, no?
Due to limitations of the BottomSheet component, I can't wrap the FrameLayout in a LinearLayout and use a layout_weight solution as it needs to be a direct child of the CoordinatorLayout.
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- I want both of these fragments to fill 50% of this coordinator layout -->
<fragment
android:id="#+id/mapFragment"
android:name="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<FrameLayout
android:id="#+id/standardBottomSheet"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior">
<!--... bottom screen layout ... -->
</FrameLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Is there something I'm missing here?

`RelativeLayout` set in a `FrameLayout` is catching touch events from the entire `FrameLayout`

EDIT: I just realized that if I want to add buttons or anything below, I want to be able to drag on top of them. So maybe my solution would be changing the Z-Index of the cards so they can appear outside the FrameLayout?
I have a FrameLayout as such:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/stack"
/>
I put a RelativeLayout in it that contains some items, but has the formatting of so:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:font="http://schemas.android.com/apk/res-auto"
android:layout_width="300dp"
android:layout_height="300dp"
android:background="#drawable/card_background"
android:layout_centerInParent="true"
>
The only reason I have my FrameLayout set to match_parent is because the user can drag the relative layout anywhere on the screen, and if the width and height of the FrameLayout are wrap_content, the RelativeLayout gets cropped when dragged. However, when leaving it as match_parent touching anywhere in the FrameLayout trigger's the LinearLayout's touch event.
For context, I'm trying to display a stack of cards, each the same size, and let the user drag the top one off the screen one by one.
I ended up adding directly to the RelativeLayout. Unfortunately, when creating a class by hand some of the gravity settings were lost, so I did something like this:
int size = ScreenMetricUtil.convertPixelToDp(getActivity().getBaseContext(), 300);
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(size, size);
params.addRule(RelativeLayout.CENTER_IN_PARENT);
card.setLayoutParams(params);
container.addView(card); // add to LinearLayout
And my helper method (source):
public static int convertPixelToDp(Context context, int pixels) {
float density = context.getResources().getDisplayMetrics().density;
return (int) (pixels * density + 0.5f);
}

Android Layout, view height is equal to screen size

in Android how to make a view have same height as its screen size, is it possible to achieve this with only the xml? or if it must use script, tell me how
Thanks.
Sorry for being not clear, and thanks for your reply
but i think, match_parent and fill_parent attribute is not reliable, because when i put the view inside one container or change the view container hierarchy, it won't work.
Here my complete xml layout.
The element i want to make the height sam with device screen is the last list view inside relative layout
No you cannot achieve this in XML only.
As Android supports multiple screen sizes, at runtime you need to check for each device size. The height for each device can be calculated like this:
Display display = getWindowManager().getDefaultDisplay();
Point size = new Point();
display.getSize(size);
int height = size.y;
With the above code, you will get the height of the screen and you need to set this height in dp to your view at runtime.
Do this in your activity:
// get view you want to resize
LinearLayout mainLayout = (LinearLayout) findViewById(R.id.main);
// get layout parameters for that view
ViewGroup.LayoutParams params = mainLayout.getLayoutParams();
// change height of the params e.g. 480dp
params.height = 480;
// initialize new parameters for my element
mainLayout.setLayoutParams(new LinearLayout.LayoutParams(params));
This can be possible from xml layout. To do this make the parent layout height and width fill_parent or match_parent and then set each child view width fill_parent or match_parent. Don't set any padding or margin to parent layout. Hope it will work. Here I am giving you an example:
<LinearLayout 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"
android:orientation="vertical" >
<Button
android:id="#+id/btn_swap"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Left or Right" />
<SurfaceView
android:id="#+id/my_surface"
android:layout_width="fill_parent"
android:layout_height="fill_parent" />
</LinearLayout>
Attention: If you use ScrollView, you have to set fillViewport="true" otherwise it will not work. A Google engineer said about it before. Check it from here
Display screenDisplay = getActivity().getWindowManager().getDefaultDisplay();
LayoutHeight = screenDisplay.getHeight();
LinearLayout.LayoutParams listLayoutParams = new LinearLayout.LayoutParams(
LayoutHeight, LinearLayout.LayoutParams.WRAP_CONTENT);
view.setLayoutParams(listLayoutParams);

How can I design a layout bigger than phone's screen?

I'm developing an Android application and I want to design, in eclipse, a layout bigger than screen height.
I have a layout for a fragment and this fragment will be inside a ScrollView on FragmentActivity.
This is my fragment's layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/user_pro_main_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/text_state"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/layout_state"
android:textAppearance="?android:attr/textAppearanceLarge" />
</LinearLayout>
Do I have to change android:layout_height="match_parent" to make it bigger on eclipse's designer?
What do I have to do if I want to see the layout bigger on eclipse designer?
Answer is pretty simple: you can't view layout which is biggern then screen on Eclipse Editor.
Possible workarounds:
1. Comment part of top views (visible) to see bottom (which are invisible), then uncomment when ready to launch.
2. Change Device Preview to bigger resolution (Nexus 10), this will give you some extra space.
You can always explicitly set the exact dp value in layout_height, but of course most of the time I don't think you want a fixed value, so do it programatically.
LinearLayout yourLayout; // Get it by findViewById()
yourLayout.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, your_calculated_height));
You would set android:layout_height="wrap_content" and as you add child elements beyond the physical screen it will continue to stretch the layout.
As for viewing this on Eclipse, I'm not sure. I personally would just run it on a device to view it.
just calculate device height and width and add int value to calculated height and width at runtime at layouts height and width.
public void deviceDisplay(){
Display display = getWindowManager().getDefaultDisplay();
int width = display.getWidth();
int height = display.getHeight();
}

How to create a view that is bigger than the screen?

Is it possible to create a view that is bigger than the screen?
I need a view that has a bigger width then the screen of the device. I use this view in a rotation animation. During the rotation the parts that were not on the screen before animating the view will become visible.
Is there a way to achieve this effect with the android framework?
Update
I tried to set my parent layout much bigger then the screen and it is working. This will make somethings a little bit uncomfortable but it could work. The next problem now is that my layout still starts at the left side of the screen. I can't think of a method to make the layout to expand itself to the left and the right of the screen.
Ok I got an answer. It is not very nice because it uses a deprecated View class but it works at least on my current testing screen resolution other resolutions are tested tomorrow.
I wrapped the view that I wanted to expand beyond the screen in an absolute layout like this:
<AbsoluteLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentBottom="true">
<ImageView
android:id="#+id/content"
android:layout_width="600dip"
android:layout_height="420dip"
android:scaleType="centerCrop"
android:layout_x="-200dip"
android:layout_y="60dip"
android:src="#color/testcolor" />
</AbsoluteLayout>
The -200 x coordinate makes the view stick 200dip out of the left side of the screen. If I'm animating the view those parts that are outside the screen will gradually become visible.
E.g. setting negative bottom margin together with setting extra large layout_height (large enough for you) solved the similar issue as for me.
Works fine at least using API 11+ animations/rotations.
Could look like:
android:layout_marginBottom="-1000dp"
android:layout_height="1000dp"
In case anyone still comes up on this page. The key is your root layout, it will only work with a FrameLayout (or the deprecated absolutelayout). Then you have two options to make your child view bigger.
through xml, this is quick and easy but you don't know the actual screen width & height in advance so your off with setting a ridiculously high value for layout_width & layout_height to cover all screens.
Calculate the screen size programatically and make the view's width/height proportional bigger to this..
Also be aware that your bigger view still starts in the top left corner of the screen so to account this you will have to give a negative top & left margin that's half of what you are adding to the view's width/height
FrameLayout.LayoutParams params = (FrameLayout.LayoutParams) viewToMakeBigger.getLayoutParams();
int marginLeft = (int) (viewToMakeBigger.getWidth()*0.1);
int marginTop = (int) (viewToMakeBigger.getHeight()*0.1);
params.width = (int) (viewToMakeBigger.getWidth()*1.2);
params.height = (int) (viewToMakeBigger.getHeight()*1.2);
params.leftMargin = -marginLeft;
params.topMargin = -marginTop;
viewToMakeBigger.setLayoutParams(params);
HorizontalScrollView:
http://developer.android.com/reference/android/widget/HorizontalScrollView.html
Layout container for a view hierarchy that can be scrolled by the user, allowing it to be larger than the physical display.
The simple axml below creates an ImageView that is 400dp wider than the screen (even though the layout_width is set to equal the parent's width) using a negative left and right margin of 200dp.
The ImageView is situated 250dp above the top of the screen using a negative top margin, with 450dp of 700dp vertical pixels visible on the screen.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:background="#FFFF0000"
android:layout_height="700dp"
android:layout_marginLeft="-200dp"
android:layout_marginRight="-200dp"
android:layout_marginTop="-250dp"
android:layout_width="match_parent" />
</RelativeLayout>
You can override the views in the onMeasure method. This will set your View dimensions to 1000x1000 px.
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setMeasuredDimension(1000, 1000);
}
Is it possible to create a view that is bigger than the screen?
Why not, you can define the layout_width and layout_height in px(or dip) as you want:
android:layout_width="10000px"
android:layout_height="20000px"
You need to change the size of the window, by getWindow().setLayout. This will increase the size for your window. Since the root layout can be as big as its parent you can then increase the size of the view you want to be bigger than the screen size. It works for me let me know
You can use ViewSwitcher to handle that. Used with Animation and a OnGestureListener looks pretty good.
You can do it programmatically:
FrameLayout.LayoutParams rootViewParams = (FrameLayout.LayoutParams) rootView.getLayoutParams();
rootViewParams.height=displayMetrics.heightPixels+(int)dpToPixels(60);
rootViewParams.width=displayMetrics.widthPixels+(int)dpToPixels(60);
rootView.setLayoutParams(rootViewParams);
rootView.setX(rootView.getX() - dpToPixels(30));
rootView.setY(rootView.getY() - dpToPixels(30));
MUST BE ONLY IN
"public void onWindowFocusChanged(boolean hasFocus)" method.
and
rootView = (RelativeLayout) findViewById(R.id.rootLayout);
Inside "protected void onCreate(Bundle savedInstanceState)" method.
Where yout .xml file is like this:
<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"
android:id="#+id/rootLayout"
tools:context="com.example.Activity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_centerHorizontal="true"
android:layout_margin="30dp"
android:layout_centerVertical="true"
android:layout_height="match_parent">
// Bla bla bla
</RelativeLayout>
and:
public float dpToPixels(float dp) {
return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, context.getResources().getDisplayMetrics());
}

Categories

Resources