Gallery와 같은 HorizontalScrollView를 구현하는 방법은 무엇입니까?
Horizontal ScrollView
갤러리의 일부 기능 을 구현하고 싶습니다 .
갤러리에서 일정 거리에서 만든 두루마리는 한 쌍으로 정렬됩니다. 즉, 화면에 세 개의 이미지가 표시된 경우 마지막 이미지를 클릭하면 중앙에 정렬됩니다.
HorizontalSCrollView
언급 한대로 어떻게 구현 합니까?
이 코드를 시도하십시오.
activity_main.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="fill_parent" android:layout_height="100dip" tools:context=".MainActivity" > <HorizontalScrollView android:id="@+id/hsv" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:fillViewport="true" android:measureAllChildren="false" android:scrollbars="none" > <LinearLayout android:id="@+id/innerLay" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center_vertical" android:orientation="horizontal" > <LinearLayout android:id="@+id/asthma_action_plan" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="match_parent" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/action_plan" /> <TextView android:layout_width="0.2dp" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:background="@drawable/ln" /> </RelativeLayout> </LinearLayout> <LinearLayout android:id="@+id/controlled_medication" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="match_parent" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/controlled" /> <TextView android:layout_width="0.2dp" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:background="@drawable/ln" /> </RelativeLayout> </LinearLayout> <LinearLayout android:id="@+id/as_needed_medication" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="match_parent" android:orientation="horizontal" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/as_needed" /> <TextView android:layout_width="0.2dp" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:background="@drawable/ln" /> </RelativeLayout> </LinearLayout> <LinearLayout android:id="@+id/rescue_medication" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="match_parent" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/rescue" /> <TextView android:layout_width="0.2dp" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:background="@drawable/ln" /> </RelativeLayout> </LinearLayout> <LinearLayout android:id="@+id/your_symptoms" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="match_parent" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/symptoms" /> <TextView android:layout_width="0.2dp" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:background="@drawable/ln" /> </RelativeLayout> </LinearLayout> <LinearLayout android:id="@+id/your_triggers" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="match_parent" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/triggers" /> <TextView android:layout_width="0.2dp" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:background="@drawable/ln" /> </RelativeLayout> </LinearLayout> <LinearLayout android:id="@+id/wheeze_rate" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="match_parent" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/wheeze_rate" /> <TextView android:layout_width="0.2dp" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:background="@drawable/ln" /> </RelativeLayout> </LinearLayout> <LinearLayout android:id="@+id/peak_flow" android:layout_width="wrap_content" android:layout_height="wrap_content" android:gravity="center" android:orientation="vertical" > <RelativeLayout android:layout_width="fill_parent" android:layout_height="match_parent" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@drawable/peak_flow" /> <TextView android:layout_width="0.2dp" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:background="@drawable/ln" /> </RelativeLayout> </LinearLayout> </LinearLayout> </HorizontalScrollView> <TextView android:layout_width="fill_parent" android:layout_height="0.2dp" android:layout_alignParentRight="true" android:layout_below="@+id/hsv" android:background="@drawable/ln" /> <LinearLayout android:id="@+id/prev" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_alignParentLeft="true" android:layout_centerVertical="true" android:paddingLeft="5dip" android:paddingRight="5dip" android:descendantFocusability="blocksDescendants" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:src="@drawable/prev_arrow" /> </LinearLayout> <LinearLayout android:id="@+id/next" android:layout_width="wrap_content" android:layout_height="fill_parent" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:paddingLeft="5dip" android:paddingRight="5dip" android:descendantFocusability="blocksDescendants" > <ImageView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:src="@drawable/next_arrow" /> </LinearLayout> </RelativeLayout>
grid_item.xml
<?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" > <ImageView android:id="@+id/imageView1" android:layout_width="fill_parent" android:layout_height="100dp" android:src="@drawable/ic_launcher" /> </LinearLayout>
MainActivity.java
import java.util.ArrayList;
import android.app.Activity;
import android.graphics.Rect;
import android.os.Bundle;
import android.os.Handler;
import android.view.Display;
import android.view.GestureDetector;
import android.view.GestureDetector.SimpleOnGestureListener;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.HorizontalScrollView;
import android.widget.LinearLayout;
import android.widget.LinearLayout.LayoutParams;
public class MainActivity extends Activity {
LinearLayout asthmaActionPlan, controlledMedication, asNeededMedication,
rescueMedication, yourSymtoms, yourTriggers, wheezeRate, peakFlow;
LayoutParams params;
LinearLayout next, prev;
int viewWidth;
GestureDetector gestureDetector = null;
HorizontalScrollView horizontalScrollView;
ArrayList<LinearLayout> layouts;
int parentLeft, parentRight;
int mWidth;
int currPosition, prevPosition;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
prev = (LinearLayout) findViewById(R.id.prev);
next = (LinearLayout) findViewById(R.id.next);
horizontalScrollView = (HorizontalScrollView) findViewById(R.id.hsv);
gestureDetector = new GestureDetector(new MyGestureDetector());
asthmaActionPlan = (LinearLayout) findViewById(R.id.asthma_action_plan);
controlledMedication = (LinearLayout) findViewById(R.id.controlled_medication);
asNeededMedication = (LinearLayout) findViewById(R.id.as_needed_medication);
rescueMedication = (LinearLayout) findViewById(R.id.rescue_medication);
yourSymtoms = (LinearLayout) findViewById(R.id.your_symptoms);
yourTriggers = (LinearLayout) findViewById(R.id.your_triggers);
wheezeRate = (LinearLayout) findViewById(R.id.wheeze_rate);
peakFlow = (LinearLayout) findViewById(R.id.peak_flow);
Display display = getWindowManager().getDefaultDisplay();
mWidth = display.getWidth(); // deprecated
viewWidth = mWidth / 3;
layouts = new ArrayList<LinearLayout>();
params = new LayoutParams(viewWidth, LayoutParams.WRAP_CONTENT);
asthmaActionPlan.setLayoutParams(params);
controlledMedication.setLayoutParams(params);
asNeededMedication.setLayoutParams(params);
rescueMedication.setLayoutParams(params);
yourSymtoms.setLayoutParams(params);
yourTriggers.setLayoutParams(params);
wheezeRate.setLayoutParams(params);
peakFlow.setLayoutParams(params);
layouts.add(asthmaActionPlan);
layouts.add(controlledMedication);
layouts.add(asNeededMedication);
layouts.add(rescueMedication);
layouts.add(yourSymtoms);
layouts.add(yourTriggers);
layouts.add(wheezeRate);
layouts.add(peakFlow);
next.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
new Handler().postDelayed(new Runnable() {
public void run() {
horizontalScrollView.smoothScrollTo(
(int) horizontalScrollView.getScrollX()
+ viewWidth,
(int) horizontalScrollView.getScrollY());
}
}, 100L);
}
});
prev.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
new Handler().postDelayed(new Runnable() {
public void run() {
horizontalScrollView.smoothScrollTo(
(int) horizontalScrollView.getScrollX()
- viewWidth,
(int) horizontalScrollView.getScrollY());
}
}, 100L);
}
});
horizontalScrollView.setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
if (gestureDetector.onTouchEvent(event)) {
return true;
}
return false;
}
});
}
class MyGestureDetector extends SimpleOnGestureListener {
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
float velocityY) {
if (e1.getX() < e2.getX()) {
currPosition = getVisibleViews("left");
} else {
currPosition = getVisibleViews("right");
}
horizontalScrollView.smoothScrollTo(layouts.get(currPosition)
.getLeft(), 0);
return true;
}
}
public int getVisibleViews(String direction) {
Rect hitRect = new Rect();
int position = 0;
int rightCounter = 0;
for (int i = 0; i < layouts.size(); i++) {
if (layouts.get(i).getLocalVisibleRect(hitRect)) {
if (direction.equals("left")) {
position = i;
break;
} else if (direction.equals("right")) {
rightCounter++;
position = i;
if (rightCounter == 2)
break;
}
}
}
return position;
}
}
문제가 있으면 알려주세요 ...
내 레이아웃은 다음과 같습니다.
<HorizontalScrollView
android:id="@+id/horizontalScrollView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="@dimen/padding" >
<LinearLayout
android:id="@+id/shapeLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp" >
</LinearLayout>
</HorizontalScrollView>
그리고 동적 체크 박스로 코드를 채 웁니다.
다음 은 코드가 포함 된 좋은 튜토리얼입니다. 그것이 당신을 위해 작동하는지 알려주세요! 이것은 또한 좋은 튜토리얼입니다.
편집하다
이 예 에서는 다음 줄을 추가하기 만하면됩니다.
gallery.setSelection(1);
어댑터를 갤러리 개체로 설정 한 후 다음 줄입니다.
gallery.setAdapter(new ImageAdapter(this));
업데이트 1
알겠습니다. 문제가 생겼습니다. 이 오픈 소스 라이브러리 가 솔루션입니다. 내 프로젝트 중 하나에도 사용했습니다. 이것이 마침내 문제를 해결할 수 있기를 바랍니다.
업데이트 2 :
이 자습서 를 진행하는 것이 좋습니다 . 당신은 아이디어를 얻을 수 있습니다. 나는 당신의 문제가 있다고 생각합니다, 당신 은 snap과 함께 수평 스크롤 뷰 를 원합니다 . Google 또는 여기에서 해당 키워드로 검색을 시도하면 솔루션을 얻을 수 있습니다.
Horizontal Variable ListView 와 비슷한 것을 구현했습니다 . 유일한 단점은 Android 2.3 이상에서만 작동한다는 것입니다.
이 라이브러리를 사용하는 것은 해당 어댑터로 ListView를 구현하는 것만 큼 간단합니다. 라이브러리는 또한 예제를 제공합니다
나는 수평 만든 목록보기 의 모든 행에 ListView를 사용하면 다음을 수행 할 수 있습니다 하나의 원하는 경우
여기에 그냥 수평 목록 보기 동영상의 썸네일 이렇게
아이디어는 HorizontalscrollView 의 LinearLayout 자식에 ImageView 를 지속적으로 추가 하는 것입니다.
참고 : 화재 기억 .removeAllViews를 (); 다음에로드하기 전에 다른 현명하게 중복 자식을 추가합니다
Cursor mImageCursor = db.getPlaylistVideoImage(playlistId);
mVideosThumbs.removeAllViews();
if (mImageCursor != null && mImageCursor.getCount() > 0) {
for (int index = 0; index < mImageCursor.getCount(); index++) {
mImageCursor.moveToPosition(index);
ImageView iv = (ImageView) imageViewInfalter.inflate(
R.layout.image_view, null);
name = mImageCursor.getString(mImageCursor
.getColumnIndex("LogoDefaultName"));
logoFile = new File(MyApplication.LOCAL_LOGO_PATH, name);
if (logoFile.exists()) {
Uri uri = Uri.fromFile(logoFile);
iv.setImageURI(uri);
}
iv.setScaleType(ScaleType.FIT_XY);
mVideosThumbs.addView(iv);
}
mImageCursor.close();
mImageCursor = null;
} else {
ImageView iv = (ImageView) imageViewInfalter.inflate(
R.layout.image_view, null);
String name = "";
File logoFile;
name = mImageCursor.getString(mImageCursor
.getColumnIndex("LogoMediumName"));
logoFile = new File(MyApplication.LOCAL_LOGO_PATH, name);
if (logoFile.exists()) {
Uri uri = Uri.fromFile(logoFile);
iv.setImageURI(uri);
}
}
HorizontalListView에 대한 내 XML
<HorizontalScrollView
android:id="@+id/horizontalScrollView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="@+id/linearLayoutTitle"
android:background="@drawable/shelf"
android:paddingBottom="@dimen/Playlist_TopBottom_margin"
android:paddingLeft="@dimen/playlist_RightLeft_margin"
android:paddingRight="@dimen/playlist_RightLeft_margin"
android:paddingTop="@dimen/Playlist_TopBottom_margin" >
<LinearLayout
android:id="@+id/linearLayoutVideos"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left|center_vertical"
android:orientation="horizontal" >
</LinearLayout>
</HorizontalScrollView>
또한 각 어린이로서의 내 이미지 뷰
<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/imageViewThumb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginRight="20dp"
android:adjustViewBounds="true"
android:background="@android:color/transparent"
android:contentDescription="@string/action_settings"
android:cropToPadding="true"
android:maxHeight="200dp"
android:maxWidth="240dp"
android:padding="@dimen/playlist_image_padding"
android:scaleType="centerCrop"
android:src="@drawable/loading" />
자세히 알아 보려면 몇 가지 쉬운 샘플이있는 다음 링크를 따라갈 수 있습니다.
HorizontalScrollView를 사용하여 수평 스크롤을 구현할 수 있습니다.
암호
<HorizontalScrollView
android:id="@+id/hsv"
android:layout_width="fill_parent"
android:layout_height="100dp"
android:layout_weight="0"
android:fillViewport="true"
android:measureAllChildren="false"
android:scrollbars="none" >
<LinearLayout
android:id="@+id/innerLay"
android:layout_width="wrap_content"
android:layout_height="100dp"
android:gravity="center_vertical"
android:orientation="horizontal" >
</LinearLayout>
</HorizontalScrollView>
Featured.xml :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="160dp"
android:layout_margin="4dp"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ProgressBar
android:layout_width="15dip"
android:layout_height="15dip"
android:id="@+id/progress"
android:layout_centerInParent="true"
/>
<ImageView
android:id="@+id/image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#20000000"
/>
<TextView
android:id="@+id/textView1"
android:layout_width="fill_parent"
android:layout_height="30dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:gravity="center"
android:textColor="#000000"
android:background="#ffffff"
android:text="Image Text" />
</RelativeLayout>
</LinearLayout>
자바 코드 :
LayoutInflater inflater;
inflater=getLayoutInflater();
LinearLayout inLay=(LinearLayout) findViewById(R.id.innerLay);
for(int x=0;x<10;x++)
{
inLay.addView(getView(x));
}
View getView(final int x)
{
View rootView = inflater.inflate( R.layout.featured_item,null);
ImageView image = (ImageView) rootView.findViewById(R.id.image);
//Thease Two Line is sufficient my dear to implement lazyLoading
AQuery aq = new AQuery(rootView);
String url="http://farm6.static.flickr.com/5035/5802797131_a729dac808_s.jpg";
aq.id(image).progress(R.id.progress).image(url, true, true, 0, R.drawable.placeholder1);
image.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View arg0) {
Toast.makeText(PhotoActivity.this, "Click Here Postion "+x,
Toast.LENGTH_LONG).show();
}
});
return rootView;
}
참고 : 지연로드를 구현하려면 AQUERY에이 링크를 사용하세요.
https://code.google.com/p/android-query/wiki/ImageLoading
참고 URL : https://stackoverflow.com/questions/18656949/how-to-implement-horizontalscrollview-like-gallery
'Programing' 카테고리의 다른 글
Struts 태그에서 #, % 및 $ 기호의 차이점은 무엇입니까? (0) | 2020.11.05 |
---|---|
h : button과 h : commandButton의 차이점 (0) | 2020.11.05 |
동일한 템플릿의 Angular2 다중 라우터 콘센트 (0) | 2020.11.05 |
OpenCV 용 .Net (dotNet) 래퍼? (0) | 2020.11.05 |
ASP.NET MVC로 마스터 페이지에서 스크립트 사용 (0) | 2020.11.05 |