I want to position my ImageView in Android Studio so it can be in the same place (ratio wise) throughout the many screen sizes of Android phones.
this is my code in activity_main.xml:
<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="com.slippysam.sooper_fly.slippysam.MainActivity"
android:background="#drawable/bgday">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxHeight="40dp"
android:maxWidth="40dp"
android:adjustViewBounds="true"
android:src="#drawable/sam"
android:id="#+id/samm"
/>
</RelativeLayout/>
and here is a function I tried using in my Activity.java
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
positionSam();
}
public void positionSam(){
final ImageView sam = (ImageView)findViewById(R.id.samm);
DisplayMetrics dm = getApplicationContext().getResources().getDisplayMetrics();
float dpHeight = dm.heightPixels / dm.density;
float dpWidth = dm.widthPixels / dm.density;
RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams) sam.getLayoutParams();
lp.leftMargin = (int) ((dpWidth * 0.5));
lp.topMargin = (int) ((dpHeight * 1.0555));
sam.setLayoutParams(lp);
}
}
this function does indeed change the position of my ImageView however it's position still isn't concrete when I switch between products.
In your layout (RelativeLayout) you need to specify where the ImageView should be placed.
You could try with the attribute android:centerInParent="true" for instance, so your layout file would look something 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: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="com.slippysam.sooper_fly.slippysam.MainActivity"
android:background="#drawable/bgday">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:maxHeight="40dp"
android:maxWidth="40dp"
android:adjustViewBounds="true"
android:centerInParent="true"
android:src="#drawable/sam"
android:id="#+id/samm" />
</RelativeLayout/>
By using centerInParent="true" you don't need to center the ImageView programmatically as you're doing it right now.
If you still want to do it programmatically, you can add a rule to your LayoutParams like this:
RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams) sam.getLayoutParams();
lp.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE);
sam.setLayoutParams(lp);
And then forget about setting the margin for the ImageView.
To use it programmatically, you will need to call your positionSam() method every time a new image is shown.
okay, so my first method was basically correct; I just needed to edit my RelativeLayout to 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:paddingBottom="0px"
android:paddingLeft="0px"
android:paddingRight="0px"
android:paddingTop="0px"
tools:context="com.slippysam.sooper_fly.slippysam.MainActivity"
android:background="#drawable/bgday">
changing the paddingBottom paddingLeft and etc. helps the function become more accurate in where I need the ImageView to be. I hope this reaches to anybody who needs it.
Related
How to programmatically align a textview, a seekbar and another textview in the same line in android studio?
Textview seekbar textview
I have written the following code snippet:
LinearLayout.LayoutParams sblayoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
sblayoutParams.setMargins(10, 100, 10, 10);
tv1.setText("0");
tv1.setBackgroundResource(R.color.yellow);
tv1.setLayoutParams(sblayoutParams);
sb1.setLayoutParams(sblayoutParams);
tv2.setText("100");
tv2.setBackgroundResource(R.color.green);
tv2.setLayoutParams(sblayoutParams);
LinearLayout sblinearLayout = findViewById(R.id.rootContainer);
// Add SeekBar to LinearLayout
if (sblinearLayout != null) {
sblinearLayout.addView(sb1);
sblinearLayout.addView(tv1);
sblinearLayout.addView(tv2);
}
The following is my XML file:
<?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"
android:id="#+id/rootContainer"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
</LinearLayout>
Current scenario:
To adjust the margins of a view programmatically is not an easy job. You need to use the right LayoutParams for that view. To make things worst, there are bunch of them. One way that I know is using instanceof like the following:
if(tv1.getLayoutParams() instanceof LinearLayout.LayoutParams) {
Toast.makeText(this, "YES", Toast.LENGTH_SHORT).show();
}
You have to test with every single LayoutParams, so good luck with that. To make story short, in your context, you need to use LinearLayout.Params:
LinearLayout.LayoutParams tvparams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
tvparams.setMargins(10, 10, 10, 100); //left, top, right, bottom
LinearLayout.LayoutParams sbparams = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
sbparams.setMargins(10, 100, 10, 0); //left, top, right, bottom
TextView tv1 = new TextView(this);
tv1.setText("0");
tv1.setGravity(Gravity.CENTER);
tv1.setBackgroundColor(Color.YELLOW);
tv1.setLayoutParams(tvparams);
SeekBar sb1 = new SeekBar(this);
sb1.setMax(100);
sb1.setProgress(100);
sb1.setLayoutParams(sbparams);
LinearLayout layout = findViewById(R.id.rootContainer);
layout.addView(tv1);
layout.addView(sb1);
[EDIT]
If you just want to them in same spot, I recommend using xml like following:
seekbar.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_height="match_parent"
android:layout_width="match_parent"
android:text="Text"
android:gravity="left|center"
android:layout_gravity="center"
android:background="#999999"/>
<SeekBar
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_gravity="center"/>
</FrameLayout>
And change a bit in your main layout to look like so:
<?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"
android:id="#+id/rootContainer"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
<include
android:layout_width="match_parent"
android:layout_height="wrap_content"
layout="#layout/seekbar" />
</LinearLayout>
Currently the LinearLayout has android:orientation="vertical", so the Views appear one below the other.
If you want them to appear side by side, you should change the orientation to android:orientation="horizontal"
Or you can set the orientation programmatically:
sbLinearLayout.setOrientation(LinearLayout.HORIZONTAL)
Change the width to WRAP_CONTENT and set a weight so all three Views get a third of the available width:
LinearLayout.LayoutParams sblayoutParams = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
sblayoutParams.setMargins(10, 100, 10, 10);
sbLayoutParams.setWeight(1.0f);
tv1.setText("0");
tv1.setBackgroundResource(R.color.yellow);
tv1.setLayoutParams(sblayoutParams);
sb1.setLayoutParams(sblayoutParams);
tv2.setText("100");
tv2.setBackgroundResource(R.color.green);
tv2.setLayoutParams(sblayoutParams);
LinearLayout sblinearLayout = findViewById(R.id.rootContainer);
// Add SeekBar to LinearLayout
if (sblinearLayout != null) {
sblinearLayout.addView(tv1);
sblinearLayout.addView(sb1);
sblinearLayout.addView(tv2);
}
I have a fragment inside a ViewPager and am trying to dynamically change the height of a ListView depending on the size of the screen.
Here is the xml code for my fragment:
Fragment.xml
<RelativeLayout
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"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<RelativeLayout
android:id="#+id/rlDiscoveredDevice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/tvSuggestBTOn">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvDiscoveredDevices"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:text="#string/text_list_discovered_devices"
/>
<ProgressBar
android:id="#+id/pbDiscoveredDevices"
style="?android:attr/progressBarStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toEndOf="#+id/tvDiscoveredDevices"
android:layout_marginStart="16dp"
/>
<ListView
android:id="#+id/lstDiscoveredBTDevices"
android:layout_height="250dp"
android:layout_width="wrap_content"
android:divider="#android:color/transparent"
android:dividerHeight="#dimen/list_view_divider_height"
android:choiceMode="singleChoice"
android:listSelector="#color/list_item_selected"
android:layout_below="#+id/tvDiscoveredDevices"
android:layout_marginTop="#dimen/list_view_margin_top"
/>
</RelativeLayout>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/pairBT"
android:background="#drawable/ic_action_down"
android:layout_marginStart="134dp"
android:layout_below="#+id/rlDiscoveredDevice"
android:layout_alignParentStart="true"
/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/unpairBT"
android:background="#drawable/ic_action_up"
android:layout_below="#+id/rlDiscoveredDevice"
android:layout_toEndOf="#+id/pairBT"
android:layout_marginStart="73dp"
/>
<RelativeLayout
android:id="#+id/rlPairedDevice"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/pairBT">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvPairedDevices"
android:text="#string/text_list_paired_devices"
android:layout_alignParentStart="true"
/>
<ListView
android:id="#+id/lstPairedBTDevices"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:divider="#android:color/transparent"
android:dividerHeight="#dimen/list_view_divider_height"
android:choiceMode="singleChoice"
android:listSelector="#color/list_item_selected"
android:layout_below="#+id/tvPairedDevices"
android:layout_alignParentStart="true"
android:layout_marginTop="#dimen/list_view_margin_top"
/>
</RelativeLayout>
</RelativeLayout>
Here is my java code that I use to dynamically change the height:
DiscoveredDevice.java
public class DiscoveredDevice extends Fragment{
final String TAG = "DiscoverDevice Fragment";
private SharedPreferences appPrefs;
private BTActions btActions;
private ArrayList<BluetoothDevice> arrDiscoveredDevicesList;
private Set<BluetoothDevice> arrPairedDevicesList;
private ArrayAdapter<String> btDiscListArrayAdapter;
private ArrayAdapter<String> btPairedListArrayAdapter;
private String strDiscoveredListItemSelected = "";
private String strPairedListItemSelected = "";
private CommonFunctions cf;
private boolean blnIsFragmentLoaded = false;
// UI Objects
private TextView tvDiscoveredDevices;
private TextView tvPairedDevices;
private ListView lvDiscoveredList;
private ListView lvPairedDevicesList;
private ImageButton ibtnPair;
private ImageButton ibtnUnPair;
private ProgressBar pbDiscDevicesSpinner;
private TextView tvSuggestBTOn;
private ProgressBar pbLoading;
public DiscoveredDevice() {
btActions = new BTActions();
cf = new CommonFunctions();
}
#Override
public void onCreate(Bundle savedInstanceState) {
Log.i(TAG, "Begin render of Discovered Device fragment...");
super.onCreate(savedInstanceState);
// Define variables
appPrefs = this.getActivity().getPreferences(Context.MODE_PRIVATE);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_discovered_device, container, false);
}
#Override
public void onActivityCreated(Bundle savedInstanceState) {
super.onActivityCreated(savedInstanceState);
// Define the lists on DiscoveredDevice fragment
btDiscListArrayAdapter = new ArrayAdapter<>(getContext(), R.layout.simple_row, R.id.simple_row_Txt);
btPairedListArrayAdapter = new ArrayAdapter<>(getContext(), R.layout.simple_row, R.id.simple_row_Txt);
// Define UI Objects
defineUIObjects();
// Position UI objects
positionUIObjects();
}
#Override
public void setUserVisibleHint(boolean isVisibleToUser) {
super.setUserVisibleHint(isVisibleToUser);
}
private void defineUIObjects() {
tvDiscoveredDevices = (TextView) getView().findViewById(R.id.tvDiscoveredDevices);
tvPairedDevices = (TextView) getView().findViewById(R.id.tvPairedDevices);
lvDiscoveredList = (ListView) getView().findViewById(R.id.lstDiscoveredBTDevices);
lvPairedDevicesList = (ListView) getView().findViewById(R.id.lstPairedBTDevices);
ibtnPair = (ImageButton) getView().findViewById(R.id.pairBT);
ibtnUnPair = (ImageButton) getView().findViewById(R.id.unpairBT);
tvSuggestBTOn = (TextView) getView().findViewById(R.id.tvSuggestBTOn);
pbDiscDevicesSpinner = (ProgressBar) getView().findViewById(R.id.pbDiscoveredDevices);
pbLoading = (ProgressBar) getView().findViewById(R.id.spin_kit_progress);
pbLoading.setIndeterminateDrawable(new DoubleBounce());
}
private void positionUIObjects() {
final ViewGroup vgDiscDevice = (ViewGroup) getView().findViewById(R.id.rlDiscoveredDevice);
final AtomicInteger aiLayoutHeight = new AtomicInteger();
Rect rect = new Rect();
// Get the window
Window win = getActivity().getWindow();
win.getDecorView().getWindowVisibleDisplayFrame(rect);
// Find height of AppBarLayout
AppBarLayout ablTabs = (AppBarLayout) getActivity().findViewById(R.id.ablTabs);
// Obtain the screen height & width
DisplayMetrics metrics = new DisplayMetrics();
getActivity().getWindowManager().getDefaultDisplay().getMetrics(metrics);
int intScreenHeight = metrics.heightPixels;
int intScreenWidth = metrics.widthPixels;
Log.i(TAG, "Actual Screen Height = " + intScreenHeight + " Width = " + intScreenWidth);
// Set the height for Discovered Devices list
RelativeLayout.LayoutParams rlParams = (RelativeLayout.LayoutParams) getView().findViewById(R.id.rlDiscoveredDevice).getLayoutParams();
// Get height of Discovered Devices relative layout
int intDiscoveredDevicesRLHeight = (int)(Math.round((intScreenHeight - rect.top - ablTabs.getMeasuredHeight()) * 0.45));
Log.i(TAG, "Setting the height of Discovered Devices Relative layout as '" + intDiscoveredDevicesRLHeight + "'");
rlParams.topMargin = ablTabs.getMeasuredHeight();
rlParams.leftMargin = 50; // I DID THIS JUST TO CHECK IF THE LEFT MARGIN GETS MOVED TO THE RIGHT. THIS IS WHERE I NEED A BETTER WAY TO PROPERLY ALIGN THE LIST
rlParams.height = intDiscoveredDevicesRLHeight;
lvDiscoveredList.setLayoutParams(rlParams);
}
I want each list to occupy 45% of the screen(excluding the AppBarLayout). If you see the below screenshot, when I set the new height, the ListView goes out of alignment and part of it gets cuts to the left of the screen. I have set the Left margin to 50 to bring it into view.
[Screenshot]
I have placed 2 ListViews inside a RelativeLayouts so that they can be individually controlled as a whole. Am I doing something wrong here ?
I think you can achieve this with just xml, no dynamic resizing!
In your post you mentioned that you want the list views to each take 45% of the available height. Thus, I am assuming that the center content with the image views will take 10% of the height (though this approach will also work if they had a fixed height, I'll include that answer too at the bottom.
All you need to do is change your top level layout to a LinearLayout (with a vertical orientation), put your image views inside of a LinearLayout (with horizontal orientation), change some of the heights of your views and add layout_weight attributes to the two RelativeLayouts and the inner LinearLayout you will create. Here is an example of what your xml will look like:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<RelativeLayout
android:id="#+id/rlDiscoveredDevice"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_above="#+id/tvSuggestBTOn"
android:layout_weight="9">
<TextView
android:id="#+id/tvDiscoveredDevices"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:text="#string/text_list_discovered_devices"
/>
<ProgressBar
android:id="#+id/pbDiscoveredDevices"
style="?android:attr/progressBarStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="16dp"
android:layout_toEndOf="#+id/tvDiscoveredDevices"
/>
<ListView
android:id="#+id/lstDiscoveredBTDevices"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/tvDiscoveredDevices"
android:divider="#android:color/transparent"
android:dividerHeight="#dimen/list_view_divider_height"
android:choiceMode="singleChoice"
android:listSelector="#color/list_item_selected"
android:background="#drawable/abc_list_selector_disabled_holo_dark"
/>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:gravity="center"
android:layout_weight="2">
<ImageButton
android:id="#+id/pairBT"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_down"
/>
<ImageButton
android:id="#+id/unpairBT"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/ic_action_up"/>
</LinearLayout>
<RelativeLayout
android:id="#+id/rlPairedDevice"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="9">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tvPairedDevices"
android:text="#string/text_list_paired_devices"
android:layout_alignParentStart="true"
/>
<ListView
android:id="#+id/lstPairedBTDevices"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:divider="#android:color/transparent"
android:dividerHeight="#dimen/list_view_divider_height"
android:choiceMode="singleChoice"
android:listSelector="#color/list_item_selected"
android:layout_below="#+id/tvPairedDevices"
android:layout_alignParentStart="true"
android:background="#drawable/abc_list_selector_disabled_holo_dark"
/>
</RelativeLayout>
</LinearLayout>
The important thing to note here is that the RelativeLayouts now have a weight of 9 each and the center linear layout has a weight of 2. Thus the space in the top level linear layout will be divided in that ratio, the RelativeLayouts will get 45% each and the LinearLayout will get 10%.
If you wanted the linear layout in the center to be wrap content instead of taking 10% of the screen (I would recommend this) then you could go ahead and assign it a height of wrap_content and remove the layout_weight attribute from it. The top level LinearLayout will then take the leftover height after allocating space for the center LinearLayout and divide it evenly between the two Relative layouts.
PS: (Heads up, you can probably use the xml I posted here. I set backgrounds on the list views to make it easy for me to see their sizes without data, make sure to remove those).
PPS: Note that this approach allows you to remove a lot of the layout positioning attributes that you had with a top level relative layout! This not only improves the cleanliness of your code, but also makes your UI more performant (Relative Layouts are less performant than other view groups, especially when nested).
I have a LinearLayout set to a static height of 100dp. I then have a textView inside it on which I set height to WRAP_CONTENT. The problem is the textView is causing the LinearLayout to expand fully to accommodate the textView when the height of the textView is greater than 100dp
I set it up this way because I want to be able to show and hide the full text when the user clicks a button. I thought setting the linearlayout's height to some minimum and then updating it to WRAP_CONTENT when clicked would work, but when I try to limit the height, the LinearLayout ignores it. I tried to set clipChildren to true but that didn't help. Code is below. I am using Android Annotations, but I don't think that's related to the problem.
<ScrollView
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:padding="30dp"
android:fitsSystemWindows="true"
android:background="#color/light_grey">
<LinearLayout
android:orientation="vertical"
android:clipChildren="true"
android:background="#color/white"
android:layout_width="match_parent"
android:layout_height="100dp">
<TextView
android:id="#+id/text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
And the Java code:
#EActivity(R.layout.activity_test)
public class TestActivity extends AppCompatActivity {
#ViewById(R.id.text_view)
TextView textView;
String input;
public static final String INPUT_STRING_KEY = "inputStringKeyForParser";
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.input = this.getIntent().getExtras().getString(INPUT_STRING_KEY);
}
#AfterViews
public void showText() {
textView.setText(input);
}
}
Does anyone know how to get the TextView to stop causing the linearlayout to expand? Thank you!
Try
<TextView
android:id="#+id/text_view"
android:layout_width="match_parent"
android:layout_height="100dp" />
Ok. I think that you can't apply height property this way because your layout is the child of ScrollView. Put your TextView inside another LinearLayout like this:
<ScrollView
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:padding="30dp"
android:fitsSystemWindows="true"
android:background="#color/light_grey">
<LinearLayout
android:orientation="vertical"
android:clipChildren="true"
android:background="#color/white"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="100dp">
<TextView
android:id="#+id/text_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
</LinearLayout>
</ScrollView>
I'm working on an application and the requirements specify that two ViewPagers interact separately. My problem is, the bottom ViewPager has to contain buttons that move with the ViewPager when swiped. That being said, I can not obtain the buttons needed within the main activity because the axml layout of the current view only contains the two viewpagers which are then set programmatically.
Here's the AXML:
<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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity">
<android.support.v4.view.ViewPager
android:id="#+id/mainViewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<android.support.v4.view.ViewPager
android:id="#+id/bottomViewPager"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_alignParentBottom="true">
</android.support.v4.view.ViewPager>
</RelativeLayout>
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#998822">
<Button
android:layout_width="75dp"
android:layout_height="75dp"
android:id="#+id/menu_button"
android:text="Menu"
android:textSize="12dp" />
</FrameLayout>
Here's how I would like to capture the button:
m_MenuButton = (Button) findViewById(R.id.menu_button);
So my question is: What is the best course of action to provide both on-click functionality while also maintaining the button's relationship with the view pager (aka, sliding when it slides)?
I have done this at work and what I did was have a separate xml of each tile of the pageview, so move your button in to a fragment.
then get the second PageViewer to display fragments as tiles.
then the constructor for the 'tile' fragments you can pass in the class in which you want call a method from when your button is pressed.
so your base page should look 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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity">
<android.support.v4.view.ViewPager
android:id="#+id/mainViewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<android.support.v4.view.ViewPager
android:id="#+id/bottomViewPager"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_alignParentBottom="true">
</android.support.v4.view.ViewPager>
</RelativeLayout>
then create a second Xml for the fragments (these could be cards, webviews what ever it is you are displaying)
to look like this
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#998822">
<Button
android:layout_width="75dp"
android:layout_height="75dp"
android:id="#+id/menu_button"
android:text="Menu"
android:textSize="12dp" />
then create a card Fragment and Change the constuctor to
...
// create an instave variable called parent so you can access the other class
private SomeClassThatHasAMethodYouWantToCall parent;
static CardFragment newInstance(SomeClassThatHasAMethodYouWantToCall parent) {
CardFragment cf = new CardFragment();
this.parent = parent;
return f;
}
// then in onCreateView
pubklic View OnCreateView()
{
View myView = infalter.inflate(containter , R.layout.myCard, false);
Button b = myView.findViewById(R.id.Mybutton);
b.setOnClickListener(v -> callMethod()); // shortened for brevity
return myView;
}
private void callMethod(){
parent.callTheMethodYouWantInTheOtherClass();
}
When you implement your pagerAdapter you will have to override the setPrimar
For Future Reference:
public class PanelFragment_One extends Fragment {
#Override
public View onCreateView
(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.panel_fragment_one, container, false);
final Button menu_button = (Button)view.findViewById(R.id.menu_button);
menu_button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Toast.makeText(PanelFragment_One.super.getContext(),
menu_button.getText() + " Clicked!",
Toast.LENGTH_LONG).show();
}
});
return view;
}
}
I want to put three images on a vertical scroll view, I don't know why, but I just see the third one ( tuto3 ).
here is the xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/scrollView" >
<LinearLayout
android:id="#+id/linearLayout42"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
</LinearLayout>
</ScrollView>
</LinearLayout>
And there the class:
public class about extends ActionBarActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.aboutlayout);
LinearLayout ll = (LinearLayout) findViewById(R.id.linearLayout42);
ImageView image = new ImageView(about.this);
image.setBackgroundResource(R.drawable.tuto1);
ll.addView(image);
ImageView image2 = new ImageView(about.this);
image.setBackgroundResource(R.drawable.tuto2);
ll.addView(image2);
ImageView image3 = new ImageView(about.this);
image.setBackgroundResource(R.drawable.tuto3);
ll.addView(image3);
}
}
You keep calling setBackgroundResource on image instead of image, image1, and image2.