Embed ViewPageIndicator inside Viewpager - android

I have this layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFFFFF"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="fill_parent"
android:layout_height="155dp" />
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/titles"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<ListView
android:id="#id/android:list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
and this code to attach the indicator in the ViewPager
CirclePageIndicator circleIndicator = (CirclePageIndicator)view.findViewById(R.id.titles);
circleIndicator.setViewPager(viewPager);
The code is working properly but is not doing exactly what i want.
The indicator is displayed at the bottom of my viewPager (below the 3 images i'm using)
is it possible to move the indicator inside the images?? So the result should be an image with the indicator "embeded".

You could try 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:background="#FFFFFF" >
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="155dp" />
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/titles"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/view_pager" />
<ListView
android:id="#id/android:list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#id/view_pager"
android:layout_alignParentBottom="true" />
</RelativeLayout>
Explanation: The ViewPager will automatically be aligned top-left within the RelativeLayout. The ListView is is anchored between the bottom of the ViewPager and the bottom of the RelativeLayout (the layout_width="0dp" is intentional). The CirclePagerIndicator has its bottom aligned with the bottom of the ViewPager.

Related

Android: How to Display included layout and listview in one view together?

I would like to ask how can i display included layout and listview positioned under the included in onde view.
Layout:
<android.support.v4.widget.SwipeRefreshLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/swipeContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activity.TransactionsActivity">
<include
android:layout_width="fill_parent"
android:layout_height="10dp"
android:layout_alignParentTop="true"
layout="#layout/preloader" />
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/list"
/>
</android.support.v4.widget.SwipeRefreshLayout>
In the preview is displayed only the included layout, but lisview below is not displayed.
Many thanks for any advice.
Since SwipeRefreshLayout accept only one child. Wrap it inside LinearLayout or RelativeLayout.
<android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/swipeContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".activity.TransactionsActivity">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
layout="#layout/preloader"
android:layout_width="fill_parent"
android:layout_height="10dp"
android:layout_alignParentTop="true" />
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Best Of Luck.

How to set a toolbar to be fixed in the bottom of the screen

I have a linearView with cardViews and some other elements.
The view with all it's elements is scrallable.
I'm trying to add a fixed toolbar in the bottom of the screen by wrapping everything in RelativeView and using alignParentBottom on the layout of my toolbar, but The toolbar is added to the bottom of the scrallable page ( you need to scroll all the way down to see it.
This is my code:
<?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="wrap_content"
android:orientation="vertical">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/fragment_poi_detail_main_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include layout="#layout/toolbar_image" />
<View
android:id="#+id/fragment_poi_detail_line"
android:layout_width="match_parent"
android:layout_height="#dimen/toolbar_shadow_height"
android:background="#drawable/shape_shadow"/>
<include
layout="#layout/fragment_poi_detail_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/fragment_poi_detail_card_margin_vertical_first"
android:layout_marginBottom="#dimen/fragment_poi_detail_card_margin_vertical"
android:layout_marginLeft="#dimen/fragment_poi_detail_card_margin_horizontal_first"
android:layout_marginRight="#dimen/fragment_poi_detail_card_margin_horizontal_last"/>
<include
layout="#layout/fragment_poi_detail_content_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/fragment_poi_detail_card_margin_vertical_first"
android:layout_marginBottom="#dimen/fragment_poi_detail_card_margin_vertical"
android:layout_marginLeft="#dimen/fragment_poi_detail_card_margin_horizontal_first"
android:layout_marginRight="#dimen/fragment_poi_detail_card_margin_horizontal_last"/>
<include
layout="#layout/fragment_poi_detail_content_banner"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/fragment_poi_detail_card_margin_vertical"
android:layout_marginBottom="#dimen/fragment_poi_detail_card_margin_vertical"
android:layout_marginLeft="#dimen/fragment_poi_detail_card_margin_horizontal_first"
android:layout_marginRight="#dimen/fragment_poi_detail_card_margin_horizontal_last" />
<include
layout="#layout/fragment_poi_detail_content_map"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/fragment_poi_detail_card_margin_vertical"
android:layout_marginBottom="#dimen/fragment_poi_detail_card_margin_vertical"
android:layout_marginLeft="#dimen/fragment_poi_detail_card_margin_horizontal_first"
android:layout_marginRight="#dimen/fragment_poi_detail_card_margin_horizontal_last" />
<include
layout="#layout/fragment_poi_detail_content_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/fragment_poi_detail_card_margin_vertical"
android:layout_marginBottom="#dimen/fragment_poi_detail_card_margin_vertical_last"
android:layout_marginLeft="#dimen/fragment_poi_detail_card_margin_horizontal_first"
android:layout_marginRight="#dimen/fragment_poi_detail_card_margin_horizontal_last" />
</LinearLayout>
<include layout="#layout/fragment_poi_detail_bottom_action_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
>
</include>
</RelativeLayout>
What am I doing wrong?
Thanks for your help :)
This is the view scrolled to bottom, and the bar in the bottom of the view.

ViewPager dynamic width height

i'm trying to position indicator below view pager the problem is that i'm using layout_height (harcoded value 474dp) is possible to use dynamic width height in order to position indicator below view pager
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#dddddd">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#dddddd">
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="274dp"
android:layout_below="#+id/title"
android:layout_marginBottom="10dp"></android.support.v4.view.ViewPager>
<CirclePageIndicator android:id="#+id/indicator"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:layout_below="#+id/pager"
app:pageColor="#858585"
app:fillColor="#f19201" />
</RelativeLayout>
</ScrollView>
You are trying to use aRelativeLayout inside a scrollview it will never work, replace or wrap it with a LinearLayout
Use LinearLayout with weight property :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#dddddd"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
<com.pockee.views.CirclePageIndicator
android:id="#+id/indicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
app:pageColor="#858585"
app:fillColor="#f19201" />
</LinearLayout>

android- How to use ViewPager inside scrollView

I've a layout that has 3 parts . One of them is viewpager . I need to scroll the screen .
i've this code but the problem is this ,the viewpager is not showing at all .
<ScrollView 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"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#drawable/s11" />
<com.astuetz.PagerSlidingTabStrip
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="48dip"
android:background="#CC0001"
android:textColor="#FFFFFF" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
How can I make viewpager to wrap the free space and fill the parent and show its content ?
thanks you

Why upper part of this layout does not display?

Here is my layout. The problem is that either the PageViewer contents are visible and nothing else. If I see PageViewer to gone than I see everything above it. Also tried root layout as frame layout but it does not help. Main thing is only the view pager is visible. What I want is 2/3 ViewPager contents which contains data, and above some header material that is 1/3. I don't want to use weights as the upper part is already sized correctly. I just want to guarantee that both the top and pageviewer display properly. Is it a characteristic of pageviewers that they switch everything? or can they not be applied below another element?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mHeaderHeader"
android:visibility="visible"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<include
android:id="#+id/myInclude"
layout="#layout/myInclude_layout" />
<include
android:id="#+id/myInclude2r"
layout="#layout/myInclude2" />
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
</FrameLayout>
<include
android:id="#+id/myInclude3"
layout="#layout/myinclude3layout" />
<ImageView
android:id="#+id/myImageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/myViewPager"
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
<include layout="#layout/myinclude4" />
</LinearLayout>
You can try something 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:orientation="vertical"
android:layout_height="match_parent" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mHeaderHeader"
android:visibility="visible"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:orientation="vertical">
<include
android:id="#+id/myInclude"
layout="#layout/myInclude_layout" />
<include
android:id="#+id/myInclude2r"
layout="#layout/myInclude2" />
<include
android:id="#+id/myInclude3"
layout="#layout/myinclude3layout" />
<ImageView
android:id="#+id/myImageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
<include layout="#layout/myinclude4"
android:id="#+id/myinclude4" />
<android.support.v4.view.ViewPager
android:id="#+id/myViewPager"
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBelow="#id/mHeaderHeader"
android:layout_alignAbove="#id/myinclude4" />
</RelativeLayout>
I suppose that ViewPager takes all space, so I placed it below header and above footer using RelativeLayout

Categories

Resources