FragmentTabHost with viewpager issue in layout - java

I have just implemented Tabs with swipe using FragmentTabHost in android. But there's an issue in the layout. When i running my application i get the below output. The swipe is only work for the below part
I Want something like
The code of XML i'm using is
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.app.FragmentTabHost
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TabWidget
android:id="#android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal" />
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
</LinearLayout>

Related

adView is not visible with wrap content

In the XML layout, everything seems perfect. When I used the emulator or real device, the adView is not visible. I tried to give height to adView like 200 dp. Then the adView is visible. But, when I gave the value of wrap_content for the height of the adView, there is a problem. I used LinearLayout and RelativeLayout but the problem is the same. What should I do for this?
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"
android:padding="30dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center"
android:text="#string/nav_contact_us_content_explanation" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:autoLink="email"
android:gravity="center"
android:selectAllOnFocus="false"
android:text="#string/nav_contact_us_content_mail" />
</LinearLayout>
<com.google.android.gms.ads.AdView
android:id="#+id/adview_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
ads:adSize="SMART_BANNER"
ads:adUnitId="ca-app-pub-3940256099942544/6300978111"></com.google.android.gms.ads.AdView>
</LinearLayout>
Try to put AdView in FrameLayout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"
android:padding="30dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center"
android:text="#string/nav_contact_us_content_explanation" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:autoLink="email"
android:gravity="center"
android:selectAllOnFocus="false"
android:text="#string/nav_contact_us_content_mail" />
</LinearLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.google.android.gms.ads.AdView
android:id="#+id/adview_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
ads:adSize="SMART_BANNER"
ads:adUnitId="ca-app-pub-3940256099942544/6300978111"/>
</FrameLayout>
</LinearLayout>
In the case of LinearLayout, as the weight was set to 1, it took the whole screen when the ad was not yet loaded. However, you should see a warning like the following in your logcat here.
W/Ads: Not enough space to show ad. Needs 320x50 dp, but only has 288x495 dp.
In order to fix the problem, you might consider using a RelativeLayout instead of a LinearLayout like the following.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/adview"
android:orientation="vertical"
android:padding="30dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center"
android:text="Contact us" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:autoLink="email"
android:gravity="center"
android:selectAllOnFocus="false"
android:text="Email" />
</LinearLayout>
<LinearLayout
android:id="#+id/adview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<com.google.android.gms.ads.AdView
android:id="#+id/adview_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
ads:adSize="SMART_BANNER"
ads:adUnitId="ca-app-pub-3940256099942544/6300978111" />
</LinearLayout>
</RelativeLayout>
On the other hand, you might also consider setting up a fixed size for the AdView so that it does not hide when the content is not yet loaded. You can get the sizes of different types of ads for different screen sizes here.

How to design this Grid view xml page?

I want to design xml page this type. I tried many of the code. Every time new problems are come. I need bottom navigation bar is fixed. In grid view ,i want android:numColums=3, android:verticalSpacing and android:horizontalSpacing Same(Look like instagram profile view grid images ).
XMl Code:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".MainSettingClass">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="175dp"
android:background="#dadada"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/profile_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#drawable/com_facebook_button_background"/>
<TextView
android:id="#+id/amsc_txt_fbusername"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="TextView"
android:layout_marginTop="2dp" />
</LinearLayout>
<GridView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/grid_test"
android:verticalSpacing="2dp"
android:horizontalSpacing="2dp"
android:background="#FFFFFF"
android:stretchMode="columnWidth"
android:columnWidth="85dp"
android:numColumns="3"/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_gallery"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#ffffff"
app:menu="#menu/bottom_navigation_gallery"/>
</FrameLayout>
As per your design you need scrollview for 2 above components and your BottomNavigationView is fix (not movable).
In your code you are not using scrollview first and second i'm not sure why you're using framelayout!
Here's my code which is exactly as per your given design try this if any concern you can ask! :)
Here's 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="match_parent"
android:orientation="vertical">
<ScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bottom_gallery">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/rel_titleHolder"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#dadada"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/profile_image"
android:layout_width="100dp"
android:layout_height="100dp"
android:src="#mipmap/ic_launcher" />
<TextView
android:id="#+id/amsc_txt_fbusername"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="2dp"
android:gravity="center"
android:text="TextView" />
</LinearLayout>
<GridView
android:id="#+id/grid_test"
android:layout_width="match_parent"
android:layout_height="400dp"
android:columnWidth="85dp"
android:horizontalSpacing="2dp"
android:numColumns="3"/>
</LinearLayout>
</ScrollView>
<android.support.design.widget.BottomNavigationView
android:id="#+id/bottom_gallery"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#ffffff"
android:layout_alignParentBottom="true" />
</RelativeLayout>

Why is the bottom of my fragment not displaying?

I created the following DialogFragment in XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/mainLayout"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/quoteLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/buttonLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<Button
android:id="#id/getMoreButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="#string/getMore"
android:onClick="getMore" />
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/adLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<com.google.android.gms.ads.AdView
android:id="#+id/adView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
ads:adSize="BANNER"
ads:adUnitId="#string/banner_ad_unit_id">
</com.google.android.gms.ads.AdView>
</LinearLayout>
</LinearLayout>
I've been working along on the quoteLayout section and have it performing as I wish. Now I wanted to fill the other sections with a button and an ad.
The problem is that nothing still shows up in the other parts of the mainLayout. The end of the screen is the end of the quoteLayout.
Any ideas?
You have it orientation set as vertical but in your linearlayout children you have the android:layout_height attribute as match_parent which fills up the layout. It should be wrap_content or use weights to better organize how it should look. At least, that's what looks wrong to me. Try swapping out match_parent to wrap_content or use weight attribute. Note that if you use weight set android:layout_height' to0dp.`
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/mainLayout"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/quoteLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/buttonLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<Button
android:id="#id/getMoreButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="#string/getMore"
android:onClick="getMore" />
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/adLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<com.google.android.gms.ads.AdView
android:id="#+id/adView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
ads:adSize="BANNER"
ads:adUnitId="#string/banner_ad_unit_id">
</com.google.android.gms.ads.AdView>
</LinearLayout>
You have set your quote layout to match_height within another LinearLayout that also matches height. Your button layout and adLayout are simply off the bottom of the screen.
To fix this, I would use layout weights like so:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/mainLayout"
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/quoteLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.5"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/buttonLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.3"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<Button
android:id="#id/getMoreButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="#string/getMore"
android:onClick="getMore" />
</LinearLayout>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#id/adLayout"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="0.2"
android:paddingLeft="5dp"
android:paddingRight="0dp"
android:orientation="vertical" >
<com.google.android.gms.ads.AdView
android:id="#+id/adView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
ads:adSize="BANNER"
ads:adUnitId="#string/banner_ad_unit_id">
</com.google.android.gms.ads.AdView>
</LinearLayout>
</LinearLayout>
Notice that I have changed layout_height to 0dp and added a layout_weight tag. This tag makes it so that your layout will adjust to a certain percentage of the height based on the values entered.
You could also use wrap_content for height.

Android - ImageView fit in TableLayout

How to make sure my Imageview fit in TableLayout? Mine can't be fit like this one.
Mine is like this
My code
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:scrollbars="none" >
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<LinearLayout android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/kelas_mengaji" />
</LinearLayout>
</TableRow>
</TableLayout>
</ScrollView>
Add this to the ImageView
android:adjustViewBounds="true"

Android ImageView getting over linearlayout

I'm developing an android application, The layout is shown in the image below :
Screenshot http://www.lebanon-trading-center.com/daymanager/layout.PNG
The layout contains 2 main linearlayouts : a horizontal layout that takes 90% of the height of the device and a vertical layout that takes 10% of it. Inside the horizontal linearlayout there is three linearlayout ( two red and one containing an imageview). Each red layout is 10% of the width of the screen and the one containing the ImageView is 80%. Here is the xml code :
<?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:orientation="vertical"
android:weightSum="1" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_weight="0.9"
android:weightSum="1"
>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="0.1"
android:background="#ff0000" >
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal"
android:gravity="center_horizontal"
android:layout_weight="0.8" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="0.1"
android:background="#ff0000" >
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_weight="0.1"
android:background="#000000" >
</LinearLayout>
</LinearLayout>
The problem is, when I set a PNG image (1036px X 730px ) as a source to the ImageView, the ImageView will get over the bottom linearlayout ( the black one ) and the two red layouts will be squeezed.
Screenshot http://www.lebanon-trading-center.com/daymanager/layout2.PNG
My question is how can I solve the problem and have the same layouts functional on all kind of tablets ?
Try this way,hope this will help you to solve your problem.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="0.90">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="0.10"
android:background="#ff0000" >
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:layout_weight="0.80" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitXY"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:orientation="vertical"
android:layout_weight="0.10"
android:background="#ff0000" >
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:layout_weight="0.10"
android:background="#000000" >
</LinearLayout>
</LinearLayout>

Categories