My app needs the height and width of the extended ImageView. I thought this should work:
package my.android.test;
public class TestImageView extends ImageView
{
private int mWidth=0;
private int mHeight=0;
public TestImageView(Context context, AttributeSet as)
{
super(context, as);
final String xmlns="http://schemas.android.com/apk/res/android";
mWidth = as.getAttributeIntValue(xmlns, "layout_width", 0);
mHeight = as.getAttributeIntValue(xmlns, "layout_height", 0);
}
#Override
protected void onDraw(Canvas canvas)
{
//do stuff
}
}
but it doesn't work. 0 is returned by getAttributeIntValue() eventhough the layout_height is defined in the layout XML:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:background="#fffcb95a"
<LinearLayout android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
<FrameLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
<RelativeLayout android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="6dip"
<my.android.test.TestImageView
android:id="#+id/TestImageViewID"
android:layout_width="100dip"
android:layout_height="100dip"
android:src="#drawable/icon"
android:scaleType="centerCrop" />
</RelativeLayout
</FrameLayout
</LinearLayout
</ScrollView
what to do ?
Note an explanation for why the original attempt doesn't work -- layout_width and layout_height are not actually holding integers, they are holding dimensions. You need to retrieve these via Context/Theme.obtainStyledAttributes, so you can get them as a TypedValue that can be converted to pixels.
Just call getWidth() and getHeight().
Related
I want to show all the pictures posted by user's in a gridview in one of my Activities. These are my codes and I am having the result in the picture below. I specified the width and height of each of the pictures in gridview(90dp,90dp), but it doesn't follow.They are being populated as their uploaded size (landscape/portrait). Also even after setting the height of the gridview to wrap_content, the height stays like the picture(about 200dp may b). How do I solve this? Where did I do wrong ?
Model of each picture:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
app:srcCompat="#drawable/post2"
android:id="#+id/imageView2"
android:scaleType="centerCrop"
android:layout_margin="0dp"/>
</RelativeLayout>
My Gridview in another activity:
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/content_competition_user"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="8dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.golstars.www.glostars.competitionUser"
tools:showIn="#layout/activity_competition_user">
<GridView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnWidth="90dp"
android:numColumns="3"
android:verticalSpacing="8dp"
android:stretchMode="columnWidth"
android:horizontalSpacing="8dp"
android:id="#+id/competitionusergrid"
/>
</ScrollView>
My Adapter :
MyUser mUser = MyUser.getmUser();
mUser.setContext(this);
Picasso.with(this).load(mUser.getProfilePicURL()).into(profileFAB);
targetList = new ArrayList<>();
targetAdapter = new GridAdapter(getApplicationContext(), targetList);
competitionusergrid.setAdapter(targetAdapter);
String target = "";
target = this.getIntent().getStringExtra("LOAD_TARGET");
System.out.println(target);
if(target.equals("COMPETITION")){
//if we have competition pics
if(targetList.isEmpty()){
ArrayList<String> aux = this.getIntent().getStringArrayListExtra("COMPETITION_PICS");
System.out.println("target list - " + aux);
for(int i = 0; i < aux.size(); i++){
targetList.add(aux.get(i));
targetAdapter.notifyDataSetChanged();
}
}
How it looks : UI
Use GridView Setup with all images are same width & height.
Use RecyclerView insteadof GridView, RecyclerView is same as GridView & easy to implement.
If you want to use current code, then you may use the following ImageView,
public class SquareImageView extends ImageView {
public SquareImageView(Context context) {
super(context);
}
public SquareImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareImageView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, widthMeasureSpec);
}}
And, the layout of each item,
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:srcCompat="#drawable/post2"
android:id="#+id/imageView2"
android:scaleType="centerCrop"
android:layout_margin="0dp"/>
</RelativeLayout>
I have activity_choose_number1.xml
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_choose_number1" />
This is content_choose_number1.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="wrap_content"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.abc.abc.ChooseNumber1"
tools:showIn="#layout/activity_choose_number1">
<ListView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:id="#+id/listViewNumberList"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp" />
</LinearLayout>
This is secnumsinglechoice.xml
<?xml version="1.0" encoding="utf-8"?>
<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:checkMark="#null"
android:drawableStart="?android:attr/listChoiceIndicatorSingle"
tools:targetApi="ice_cream_sandwich"
android:textSize="25dp"
android:linksClickable="false"
android:checked="false"
android:paddingTop="20dp"
android:paddingBottom="20dp" />
The secnumsinglechoice.xml is copy paste of android.R.layout.simple_list_item_single_choice and made some changes.
Now what I need is to center align the checkbox and text of secnumusingchoice.xml. I also need the checkbox to be left side of text in each item of list view
Things I tried
1) If I do drawableLeft, it creates space between text and checkbox, but doesn't make both to be centered
2) If I add android:textAlignment="center" then still it center aligns the text but not the check box .
3) I tried here center text and checkmark of CheckedTextView but I would like to try here with more code.
Please help. Thanks.
Is that what you want
<LinearLayout
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#android:color/white"
android:gravity="center">
<CheckBox
android:id="#+id/ckb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true" />
<TextView
android:id="#+id/tvEduName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="ABC"
android:textSize="17sp" />
</LinearLayout>
Result
To get everything to center correctly, we'll subclass CheckedTextView, and override its onDraw() method to first measure the combined Drawable and text widths and paddings, and then translate the Canvas accordingly before calling the super method to actually do the draw.
import android.content.Context;
import android.graphics.Canvas;
import android.util.AttributeSet;
import android.widget.CheckedTextView;
import android.text.Layout;
public class CenteredCheckedTextView extends CheckedTextView {
public CenteredCheckedTextView(Context context) {
this(context, null);
}
public CenteredCheckedTextView(Context context, AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onDraw(Canvas canvas) {
if (getCompoundDrawables()[0] == null) {
super.onDraw(canvas);
}
else {
// Left drawable and paddings width
final float dw = getCompoundDrawables()[0].getIntrinsicWidth() +
getPaddingLeft() + getCompoundDrawablePadding();
// Text width
final float tw = getMaxLineMeasure();
canvas.save();
canvas.translate((getWidth() - (dw + tw)) / 2f, 0f);
super.onDraw(canvas);
canvas.restore();
}
}
private float getMaxLineMeasure() {
final Layout layout = getLayout();
final int lines = getLineCount();
float m = 0, max = 0;
for (int i = 0; i < lines; ++i) {
m = getPaint().measureText(getText(),
layout.getLineStart(i),
layout.getLineEnd(i));
if (m > max) {
max = m;
}
}
return max;
}
}
CheckedTextView has a checkMarkGravity attribute that determines on which end it places the checkMark Drawable, but it's not public, for some odd reason, so we'll just use the drawableLeft. For example:
<com.mycompany.myapp.CenteredCheckedTextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:textSize="25dp"
android:drawableLeft="?android:attr/listChoiceIndicatorSingle" />
You might need to slightly fiddle with the translation and/or width values in the custom class to get everything to line up with what looks centered to you, depending on what kind of transparent, intrinsic padding the Drawable has.
I have a layout which contains only a LinearLayour with 3 buttons inside.
I would want this 3 buttons to fill the screen vertically so I used "weigth=1" but I should also want the buttons to be square, that is, that their width is equal to their height.
Any way to do it?
Here's the .xml file
<?xml version="1.0" encoding="utf-8"?>
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="android.jose.se.Prueba"
android:background="#drawable/bg"
android:gravity="center">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<Button
android:id="#+id/bHet"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/layer1"
android:onClick="cambiarBoton"/>
<Button
android:id="#+id/bGay"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/layer2"
android:onClick="cambiarBoton"/>
<Button
android:id="#+id/bLesbi"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:background="#drawable/layer3"
android:onClick="cambiarBoton"/>
</LinearLayout>
</RelativeLayout>
I had similar issue and done it using Google's Percent Relative Layout that helps you manage view aspect ratio.
You can use it like this
<android.support.percent.PercentRelativeLayout
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">
<Button
android:layout_width="match_parent"
app:layout_aspectRatio="100%"/>
</android.support.percent.PercentFrameLayout>
The best way to do this, is to make a new Class called Square button and this class should extend Button. Then in the onMeasure of this class, simply make your heightSpec as WidthSpec.
public class SquareButton extends Button {
public SquareButton(Context context) {
super(context);
}
public SquareButton(Context context, AttributeSet attrs) {
super(context, attrs);
}
public SquareButton(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
}
#Override
protected void onMeasure(int WidthSpec, int HeightSpec){
int newWidthSpec = HeightSpec ;
super.onMeasure(newWidthSpec, HeightSpec);
}}
Now you can use this SquareButton instead of a normal Button in your xml like this. The value of android:width attribute will be ignored.
<com.example.package.SquareButton
android:height = "0dp"
android:weight = "1"
android:width = "0dp"
/>
currently I am developing a settings menu in a scrollview. The basic structure looks like the following:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:id="#+id/scrollview_settings"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="#dimen/paddingSmall">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/transparent_white_settings"
android:paddingTop="#dimen/paddingMedium"
android:paddingBottom="#dimen/paddingMedium">
<ImageView
android:id="#+id/logo"
android:layout_width="68dp"
android:layout_height="wrap_content"
android:src="#drawable/newspaper_logo_color"
android:layout_alignParentRight="true"
android:layout_margin="#dimen/paddingBig"
android:adjustViewBounds="true"/>
</RelativeLayout>
<!-- Layout News Uebersicht -->
<include layout="#layout/separator_line_grey"/>
<de.basecom.noznewsapp.views.FontTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAllCaps="true"
android:textColor="#color/buttonHoverBackground"
android:textSize="#dimen/sliding_image_kicker_font_size"
android:paddingLeft="#dimen/paddingLarge"
android:paddingTop="#dimen/paddingMedium"
android:paddingBottom="#dimen/paddingMedium"
android:text="#string/news_overview"
android:textScaleX="#dimen/letter_spacing"
android:textStyle="bold"
android:gravity="center_vertical"
android:background="#color/settings_header_color"
android:layout_gravity="center_vertical"/>
<include layout="#layout/separator_line_grey"/>
<!-- News-Overview Issues -->
<LinearLayout
android:id="#+id/issue_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#color/transparent_white_settings">
<de.basecom.noznewsapp.views.NewsScrollListView
android:id="#+id/listview_issues"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:descendantFocusability="blocksDescendants"
android:divider="#null"
android:dividerHeight="0dp" />
</LinearLayout>
<!-- Layout Einstellungen -->
<de.basecom.noznewsapp.views.FontTextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAllCaps="true"
android:textColor="#color/buttonHoverBackground"
android:textSize="#dimen/sliding_image_kicker_font_size"
android:paddingLeft="#dimen/paddingLarge"
android:paddingTop="#dimen/paddingMedium"
android:paddingBottom="#dimen/paddingMedium"
android:text="#string/settings"
android:textStyle="bold"
android:textScaleX="#dimen/letter_spacing"
android:gravity="center_vertical"
android:background="#color/settings_header_color"
android:layout_gravity="center_vertical"/>
<include layout="#layout/separator_line_grey"/>
<!-- Einstellungs- Werte -->
<LinearLayout
android:id="#+id/settings_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#color/transparent_white_settings">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="#dimen/paddingLarge">
<de.basecom.noznewsapp.views.FontTextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/receive_pushmessages"
android:textAllCaps="true"
android:textScaleX="#dimen/letter_spacing"
android:textSize="#dimen/sliding_image_kicker_font_size"
android:layout_centerVertical="true"
android:textColor="#color/buttonBackground"/>
<Switch
android:id="#+id/receive_pushmessages_switch"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="#string/empty_string"/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
For the listview I used a custom implementation, to give it a fix height and make it able to scroll within the scrollview (note: I have to use the listview within the scrollview, because I have lots of elements, so that using a linearlayout wouldn't be nice).
public class CustomListView extends ListView {
public CustomListView(Context context) {
super(context);
}
public CustomListView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public CustomListView(Context context, AttributeSet attrs,int defStyle) {
super(context, attrs, defStyle);
}
#Override
public void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
// Calculate entire height by providing a very large height hint.
// But do not use the highest 2 bits of this integer; those are
// reserved for the MeasureSpec mode.
int expandSpec = MeasureSpec.makeMeasureSpec(Integer.MAX_VALUE >> 2, MeasureSpec.AT_MOST);
super.onMeasure(widthMeasureSpec, expandSpec);
ViewGroup.LayoutParams params = getLayoutParams();
params.height = getMeasuredHeight();
}
}
Each item of the listview contains a label and a gridview, which is all shown correctly. But now I want to implement the functionality, that the user can click on the label to show and hide the visibility of the gridview.
But if I click on the label and the gridview is shown, the height of the listview doesn't adapt to the new open element. It always stays at the same height and if I open an element, the elements below are no longer visible. This also even happens, if I call the requestLayout() method of the listview to trigger its onMeasure again.
Anybody got an idea what I am doing wrong?
EDIT: Updated my xml file :)
Finally I was only able to solve this issue by replacing Listview with a LinearLayout and add my items in code to the Layout.
I have a ScrollView that contain one imageView
I want this imageView matching the parent width, full width of the screen and then keep ratio aspect, so wrapping the height.
My options where :
- layout_widht : match_parent
- layout_height : wrap_content
- scaletype : centerCrop
Here is the 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="wrap_content"
android:fillViewport="true" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/cellarWineImageView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:src="#drawable/etiquette_unknown" />
</LinearLayout>
</ScrollView>
Here is the result
If I just put a fixe height 348dp the result is here
After fighting, I suspect that the wrap content, consider the original height of the image, doesn't matter if the size change due to match parent of the width. Please help for such basic topic. And I hope we can handle this without making any code...
Based on Akshat Agarwal great answer, we can use simple stuff by extending ImageView into a a new component : AspectRatioImageView, and then reusing it directly in the layout.
package com.yourpackage.widgets;
import android.content.Context;
import android.util.AttributeSet;
import android.widget.ImageView;
public class AspectRatioImageView extends ImageView {
public AspectRatioImageView(Context context) {
super(context);
}
public AspectRatioImageView(Context context, AttributeSet attrs) {
super(context, attrs);
}
public AspectRatioImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
if (getDrawable() == null)
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
else {
int width = MeasureSpec.getSize(widthMeasureSpec);
int height = width * getDrawable().getIntrinsicHeight() / getDrawable().getIntrinsicWidth();
setMeasuredDimension(width, height);
}
}
}
Now to use it in the XML:
<com.yourpackage.widgets.AspectRatioImageView android:layout_centerHorizontal="true"
android:src="#drawable/yourdrawable" android:id="#+id/image"
android:layout_alignParentTop="true" android:layout_height="wrap_content"
android:layout_width="match_parent" android:adjustViewBounds="true" />
This works great on my project, by just changing curent ImageView, by this new packageName. Then everything worked perfectly.
Try putting on LinearLayout, ImageView and ScrollView your android:layout_height="fill_parent" to see if works.
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:gravity="center">
<ImageView
android:id="#+id/cellarWineImageView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/ic_launcher"
android:scaleType="fitXY" />
</LinearLayout>
change the layout like this
<?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="wrap_content"
android:fillViewport="true" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:minHeight="348dp"
android:orientation="vertical" >
<ImageView
android:id="#+id/cellarWineImageView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:minHeight="348dp"
android:src="#drawable/ic_launcher" />
</LinearLayout>