保持 Fragment ImageView 上的按钮发生变化
Posted
技术标签:
【中文标题】保持 Fragment ImageView 上的按钮发生变化【英文标题】：Keeping the buttons on Fragment ImageView change 【发布时间】：2015-12-22 15:03:40 【问题描述】：我有一个在滑动时显示图像的片段，我在底部添加了一个原始按钮。我的问题是每次更改图像时都会移动/重新创建按钮。是否有一种方法可以让 Fragment 类上的按钮处于固定位置，这样它们就不会与 Fragment 一起移动？无法在 FragmentActivity 类上添加按钮，因为我无法将位图从 Fragment 传递到 FragmentActivity 以进行共享/保存等选项。
谢谢！
image_detail_fragment.xml
<?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_
android:layout_
android:background="@color/black">
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_ >
<ProgressBar
style="?android:attr/progressBarStyleLarge"
android:layout_
android:layout_
android:layout_gravity="center" />
<com.example.android.displayingbitmaps.ui.RecyclingImageView
android:id="@+id/imageView"
android:layout_
android:layout_
android:contentDescription="@string/imageview_description" />
</FrameLayout>
<LinearLayout
android:id="@+id/llShare"
android:layout_
android:layout_
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginBottom="49dp"
android:layout_marginLeft="90dp"
android:background="@drawable/btn_rounded_corner"
android:gravity="center_vertical"
android:orientation="horizontal" >
<ImageView
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:layout_
android:layout_
android:src="@drawable/ic_menu_share" />
</LinearLayout>
</RelativeLayout>
ImageDetailFragment.java
package com.example.android.displayingbitmaps.ui;
import android.graphics.Bitmap;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.ViewGroup;
import android.widget.ImageView;
import com.example.android.displayingbitmaps.R;
import com.example.android.displayingbitmaps.util.ImageFetcher;
import com.example.android.displayingbitmaps.util.ImageWorker;
import com.example.android.displayingbitmaps.util.Utils;
/**
* This fragment will populate the children of the ViewPager from @link ImageDetailActivity.
*/
public class ImageDetailFragment extends Fragment
private static final String IMAGE_DATA_EXTRA = "extra_image_data";
private String mImageUrl;
public ImageView mImageView;
private ImageFetcher mImageFetcher;
public Bitmap bitmap;
/**
* Factory method to generate a new instance of the fragment given an image number.
*
* @param imageUrl The image url to load
* @return A new instance of ImageDetailFragment with imageNum extras
*/
public static ImageDetailFragment newInstance(String imageUrl)
final ImageDetailFragment f = new ImageDetailFragment();
final Bundle args = new Bundle();
args.putString(IMAGE_DATA_EXTRA, imageUrl);
f.setArguments(args);
return f;
/**
* Empty constructor as per the Fragment documentation
*/
public ImageDetailFragment()
/**
* Populate image using a url from extras, use the convenience factory method
* @link ImageDetailFragment#newInstance(String) to create this fragment.
*/
@Override
public void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
mImageUrl = getArguments() != null ? getArguments().getString(IMAGE_DATA_EXTRA) : null;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState)
// Inflate and locate the main ImageView
final View v = inflater.inflate(R.layout.image_detail_fragment, container, false);
mImageView = (ImageView) v.findViewById(R.id.imageView);
return v;
@Override
public void onActivityCreated(Bundle savedInstanceState)
super.onActivityCreated(savedInstanceState);
// Use the parent activity to load the image asynchronously into the ImageView (so a single
// cache can be used over all pages in the ViewPager
if (ImageDetailActivity.class.isInstance(getActivity()))
mImageFetcher = ((ImageDetailActivity) getActivity()).getImageFetcher();
mImageFetcher.loadImage(mImageUrl, mImageView);
// Pass clicks on the ImageView to the parent activity to handle
if (OnClickListener.class.isInstance(getActivity()) && Utils.hasHoneycomb())
mImageView.setOnClickListener((OnClickListener) getActivity());
@Override
public void onDestroy()
super.onDestroy();
if (mImageView != null)
// Cancel any pending image work
ImageWorker.cancelWork(mImageView);
mImageView.setImageDrawable(null);
image_detail_pager.xml
<?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_
android:layout_
android:background="@color/black"
>
<LinearLayout
android:layout_
android:layout_
android:layout_marginBottom="90dp"
xmlns:android="http://schemas.android.com/apk/res/android">
<!-- android:layout_above="@+id/llBack"-->
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_
android:layout_ >
</android.support.v4.view.ViewPager>
</LinearLayout>
</RelativeLayout>
ImageDetailActivity.java
package com.example.android.displayingbitmaps.ui;
import android.annotation.TargetApi;
import android.app.ActionBar;
import android.os.Build.VERSION_CODES;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.app.NavUtils;
import android.support.v4.view.ViewPager;
import android.util.DisplayMetrics;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.WindowManager.LayoutParams;
import android.widget.Toast;
import com.example.android.displayingbitmaps.BuildConfig;
import com.example.android.displayingbitmaps.R;
import com.example.android.displayingbitmaps.provider.Images;
import com.example.android.displayingbitmaps.util.ImageCache;
import com.example.android.displayingbitmaps.util.ImageFetcher;
import com.example.android.displayingbitmaps.util.Utils;
public class ImageDetailActivity extends FragmentActivity
private static final String IMAGE_CACHE_DIR = "images";
public static final String EXTRA_IMAGE = "extra_image";
private ImagePagerAdapter mAdapter;
private ImageFetcher mImageFetcher;
private ViewPager mPager;
public ImageDetailFragment detail;
@TargetApi(VERSION_CODES.HONEYCOMB)
@Override
public void onCreate (Bundle savedInstanceState)
detail= new ImageDetailFragment();
if (BuildConfig.DEBUG)
Utils.enableStrictMode();
super.onCreate(savedInstanceState);
setContentView(R.layout.image_detail_pager);
// Fetch screen height and width, to use as our max size when loading images as this
// activity runs full screen
final DisplayMetrics displayMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
final int height = displayMetrics.heightPixels;
final int width = displayMetrics.widthPixels;
// For this sample we'll use half of the longest width to resize our images. As the
// image scaling ensures the image is larger than this, we should be left with a
// resolution that is appropriate for both portrait and landscape. For best image quality
// we shouldn't divide by 2, but this will use more memory and require a larger memory
// cache.
final int longest = (height > width ? height : width) / 2;
ImageCache.ImageCacheParams cacheParams =
new ImageCache.ImageCacheParams(this, IMAGE_CACHE_DIR);
cacheParams.setMemCacheSizePercent(0.25f); // Set memory cache to 25% of app memory
// The ImageFetcher takes care of loading images into our ImageView children asynchronously
mImageFetcher = new ImageFetcher(this, longest);
mImageFetcher.addImageCache(getSupportFragmentManager(), cacheParams);
mImageFetcher.setImageFadeIn(false);
// Set up ViewPager and backing adapter
mAdapter = new ImagePagerAdapter(getSupportFragmentManager(), Images.imageUrls.length);
mPager = (ViewPager) findViewById(R.id.pager);
mPager.setAdapter(mAdapter);
mPager.setPageMargin((int) getResources().getDimension(R.dimen.horizontal_page_margin));
mPager.setOffscreenPageLimit(2);
// Set up activity to go full screen
getWindow().addFlags(LayoutParams.FLAG_FULLSCREEN);
// Enable some additional newer visibility and ActionBar features to create a more
// immersive photo viewing experience
if (Utils.hasHoneycomb())
final ActionBar actionBar = getActionBar();
// Hide title text and set home as up
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayHomeAsUpEnabled(true);
// Hide and show the ActionBar as the visibility changes
mPager.setOnSystemUiVisibilityChangeListener(
new View.OnSystemUiVisibilityChangeListener()
@Override
public void onSystemUiVisibilityChange(int vis)
if ((vis & View.SYSTEM_UI_FLAG_LOW_PROFILE) != 0)
actionBar.hide();
else
actionBar.show();
);
// Start low profile mode and hide ActionBar
mPager.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LOW_PROFILE);
actionBar.hide();
// Set the current item based on the extra passed in to this activity
final int extraCurrentItem = getIntent().getIntExtra(EXTRA_IMAGE, -1);
if (extraCurrentItem != -1)
mPager.setCurrentItem(extraCurrentItem);
@Override
public void onResume()
super.onResume();
mImageFetcher.setExitTasksEarly(false);
@Override
protected void onPause()
super.onPause();
mImageFetcher.setExitTasksEarly(true);
mImageFetcher.flushCache();
@Override
protected void onDestroy()
super.onDestroy();
mImageFetcher.closeCache();
@Override
public boolean onOptionsItemSelected(MenuItem item)
switch (item.getItemId())
case android.R.id.home:
NavUtils.navigateUpFromSameTask(this);
return true;
case R.id.clear_cache:
mImageFetcher.clearCache();
Toast.makeText(
this, R.string.clear_cache_complete_toast,Toast.LENGTH_SHORT).show();
return true;
return super.onOptionsItemSelected(item);
@Override
public boolean onCreateOptionsMenu(Menu menu)
getMenuInflater().inflate(R.menu.main_menu, menu);
return true;
/**
* Called by the ViewPager child fragments to load images via the one ImageFetcher
*/
public ImageFetcher getImageFetcher()
return mImageFetcher;
/**
* The main adapter that backs the ViewPager. A subclass of FragmentStatePagerAdapter as there
* could be a large number of items in the ViewPager and we don't want to retain them all in
* memory at once but create/destroy them on the fly.
*/
private class ImagePagerAdapter extends FragmentStatePagerAdapter
private final int mSize;
public ImagePagerAdapter(FragmentManager fm, int size)
super(fm);
mSize = size;
@Override
public int getCount()
return mSize;
@Override
public Fragment getItem(int position)
return ImageDetailFragment.newInstance(Images.imageUrls[position]);
/**
* Set on the ImageView in the ViewPager children fragments, to enable/disable low profile mode
* when the ImageView is touched.
*/
@TargetApi(VERSION_CODES.HONEYCOMB)
@Override
public void onClick(View v)
final int vis = mPager.getSystemUiVisibility();
if ((vis & View.SYSTEM_UI_FLAG_LOW_PROFILE) != 0)
mPager.setSystemUiVisibility(View.SYSTEM_UI_FLAG_VISIBLE);
else
mPager.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LOW_PROFILE);
好的，所以我设法获得了这个职位
int index = mPager.getCurrentItem();
但是我怎样才能从中获取 Drawable，所以我可以创建我需要的位图，因为我的项目是字符串，如下所示：
public class Images
public final static String[] imageUrls = new String[]
"https://lh6.googleusercontent.com/-55osAWw3x0Q/URquUtcFr5I/AAAAAAAAAbs/rWlj1RUKrYI/s1024/A%252520Photographer.jpg",
"https://lh4.googleusercontent.com/--dq8niRp7W4/URquVgmXvgI/AAAAAAAAAbs/-gnuLQfNnBA/s1024/A%252520Song%252520of%252520Ice%252520and%252520Fire.jpg",
"https://lh5.googleusercontent.com/-7qZeDtRKFKc/URquWZT1gOI/AAAAAAAAAbs/hqWgteyNXsg/s1024/Another%252520Rockaway%252520Sunset.jpg",
"https://lh3.googleusercontent.com/--L0Km39l5J8/URquXHGcdNI/AAAAAAAAAbs/3ZrSJNrSomQ/s1024/Antelope%252520Butte.jpg",
"https://lh6.googleusercontent.com/-8HO-4vIFnlw/URquZnsFgtI/AAAAAAAAAbs/WT8jViTF7vw/s1024/Antelope%252520Hallway.jpg",
;
谢谢！
【问题讨论】：
能否粘贴您的代码？ 我添加了代码。谢谢。 【参考方案1】：您需要编辑image_detail_pager.xml 并在底部添加一个固定按钮布局。
例如：
<?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_
android:layout_
android:background="@color/black"
>
<LinearLayout
android:layout_
android:layout_
android:layout_marginBottom="90dp"
xmlns:android="http://schemas.android.com/apk/res/android">
<!-- android:layout_above="@+id/llBack"-->
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_
android:layout_ >
</android.support.v4.view.ViewPager>
</LinearLayout>
<LinearLayout
android:id="@+id/llShare"
android:layout_
android:layout_
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginBottom="49dp"
android:layout_marginLeft="90dp"
android:background="@drawable/btn_rounded_corner"
android:gravity="center_vertical"
android:orientation="horizontal" >
<ImageView
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:layout_
android:layout_
android:src="@drawable/ic_menu_share" />
</LinearLayout>
</RelativeLayout>
然后您可以像这样在ImageDetailActivity.java 中找到您的分享按钮：
package com.example.android.displayingbitmaps.ui;
import android.annotation.TargetApi;
import android.app.ActionBar;
import android.os.Build.VERSION_CODES;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.app.NavUtils;
import android.support.v4.view.ViewPager;
import android.util.DisplayMetrics;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.WindowManager.LayoutParams;
import android.widget.Toast;
import com.example.android.displayingbitmaps.BuildConfig;
import com.example.android.displayingbitmaps.R;
import com.example.android.displayingbitmaps.provider.Images;
import com.example.android.displayingbitmaps.util.ImageCache;
import com.example.android.displayingbitmaps.util.ImageFetcher;
import com.example.android.displayingbitmaps.util.Utils;
public class ImageDetailActivity extends FragmentActivity
private static final String IMAGE_CACHE_DIR = "images";
public static final String EXTRA_IMAGE = "extra_image";
private ImagePagerAdapter mAdapter;
private ImageFetcher mImageFetcher;
private ViewPager mPager;
public ImageDetailFragment detail;
private LinearLayout shareLL;
@TargetApi(VERSION_CODES.HONEYCOMB)
@Override
public void onCreate (Bundle savedInstanceState)
detail= new ImageDetailFragment();
if (BuildConfig.DEBUG)
Utils.enableStrictMode();
super.onCreate(savedInstanceState);
setContentView(R.layout.image_detail_pager);
shareLL = (LinearLayout) findViewById(R.id.llShare);
shareLL.setOnClickListener(this);
// Fetch screen height and width, to use as our max size when loading images as this
// activity runs full screen
final DisplayMetrics displayMetrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(displayMetrics);
final int height = displayMetrics.heightPixels;
final int width = displayMetrics.widthPixels;
// For this sample we'll use half of the longest width to resize our images. As the
// image scaling ensures the image is larger than this, we should be left with a
// resolution that is appropriate for both portrait and landscape. For best image quality
// we shouldn't divide by 2, but this will use more memory and require a larger memory
// cache.
final int longest = (height > width ? height : width) / 2;
ImageCache.ImageCacheParams cacheParams =
new ImageCache.ImageCacheParams(this, IMAGE_CACHE_DIR);
cacheParams.setMemCacheSizePercent(0.25f); // Set memory cache to 25% of app memory
// The ImageFetcher takes care of loading images into our ImageView children asynchronously
mImageFetcher = new ImageFetcher(this, longest);
mImageFetcher.addImageCache(getSupportFragmentManager(), cacheParams);
mImageFetcher.setImageFadeIn(false);
// Set up ViewPager and backing adapter
mAdapter = new ImagePagerAdapter(getSupportFragmentManager(), Images.imageUrls.length);
mPager = (ViewPager) findViewById(R.id.pager);
mPager.setAdapter(mAdapter);
mPager.setPageMargin((int) getResources().getDimension(R.dimen.horizontal_page_margin));
mPager.setOffscreenPageLimit(2);
// Set up activity to go full screen
getWindow().addFlags(LayoutParams.FLAG_FULLSCREEN);
// Enable some additional newer visibility and ActionBar features to create a more
// immersive photo viewing experience
if (Utils.hasHoneycomb())
final ActionBar actionBar = getActionBar();
// Hide title text and set home as up
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayHomeAsUpEnabled(true);
// Hide and show the ActionBar as the visibility changes
mPager.setOnSystemUiVisibilityChangeListener(
new View.OnSystemUiVisibilityChangeListener()
@Override
public void onSystemUiVisibilityChange(int vis)
if ((vis & View.SYSTEM_UI_FLAG_LOW_PROFILE) != 0)
actionBar.hide();
else
actionBar.show();
);
// Start low profile mode and hide ActionBar
mPager.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LOW_PROFILE);
actionBar.hide();
// Set the current item based on the extra passed in to this activity
final int extraCurrentItem = getIntent().getIntExtra(EXTRA_IMAGE, -1);
if (extraCurrentItem != -1)
mPager.setCurrentItem(extraCurrentItem);
@Override
public void onResume()
super.onResume();
mImageFetcher.setExitTasksEarly(false);
@Override
protected void onPause()
super.onPause();
mImageFetcher.setExitTasksEarly(true);
mImageFetcher.flushCache();
@Override
protected void onDestroy()
super.onDestroy();
mImageFetcher.closeCache();
@Override
public boolean onOptionsItemSelected(MenuItem item)
switch (item.getItemId())
case android.R.id.home:
NavUtils.navigateUpFromSameTask(this);
return true;
case R.id.clear_cache:
mImageFetcher.clearCache();
Toast.makeText(
this, R.string.clear_cache_complete_toast,Toast.LENGTH_SHORT).show();
return true;
return super.onOptionsItemSelected(item);
@Override
public boolean onCreateOptionsMenu(Menu menu)
getMenuInflater().inflate(R.menu.main_menu, menu);
return true;
/**
* Called by the ViewPager child fragments to load images via the one ImageFetcher
*/
public ImageFetcher getImageFetcher()
return mImageFetcher;
/**
* The main adapter that backs the ViewPager. A subclass of FragmentStatePagerAdapter as there
* could be a large number of items in the ViewPager and we don't want to retain them all in
* memory at once but create/destroy them on the fly.
*/
private class ImagePagerAdapter extends FragmentStatePagerAdapter
private final int mSize;
public ImagePagerAdapter(FragmentManager fm, int size)
super(fm);
mSize = size;
@Override
public int getCount()
return mSize;
@Override
public Fragment getItem(int position)
return ImageDetailFragment.newInstance(Images.imageUrls[position]);
/**
* Set on the ImageView in the ViewPager children fragments, to enable/disable low profile mode
* when the ImageView is touched.
*/
@TargetApi(VERSION_CODES.HONEYCOMB)
@Override
public void onClick(View v)
switch(v.getId())
case R.id.llShare:
//Get your current ImageFragment Position from ViewPager's Adapter and do Whatever you want to do man !
break;
/*final int vis = mPager.getSystemUiVisibility();
if ((vis & View.SYSTEM_UI_FLAG_LOW_PROFILE) != 0)
mPager.setSystemUiVisibility(View.SYSTEM_UI_FLAG_VISIBLE);
else
mPager.setSystemUiVisibility(View.SYSTEM_UI_FLAG_LOW_PROFILE);
*/
我希望这会有所帮助。
【讨论】：
谢谢萨尔曼。你能告诉我如何获得 ImageFragment 位置吗？ 好的，这个链接可以帮到你***.com/questions/8587175/… 谢谢萨尔曼。但是我在尝试获取它的可绘制内容时遇到了麻烦。我使用 int index = mPager.getCurrentItem();但我没有意识到一种从中制作drawable的方法，因为我的图像是字符串，如上所示。我想我需要drawable，这样我就可以用它制作位图，然后最后分享图像。 由于您使用 url 来显示图像，我建议您缓存它们以备将来使用。这样您就可以访问缓存的位置或在未缓存的情况下请求下载，然后共享下载的图像位图对象。 这里有一个链接可以帮助您管理下载请求***.com/questions/3657587/… 我建议您在下载图像时显示ProgressDialog，onPostExecute(...) 显示带有位图对象设置初始化的共享对话框。 以上是关于保持 Fragment ImageView 上的按钮发生变化的主要内容，如果未能解决你的问题，请参考以下文章
使用Viewpager更新Fragment中的Imageview