2014-10-27 33 views
-1

在這裏,我將練習一些使用自動調整圖片大小的GridView教程。我通過這tutorial我的活動。接下來我要做的是如何讓圖片可點擊。所以當用戶點擊每個圖像時,它會轉到某個課程/活動。製作可點擊的圖片以打開其他活動

下面是從我試驗程序若干個碼:

activity_main.xml中扔一個gridview到佈局,拉伸模式和列寬:

<?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" 
> 
<GridView 
    android:id="@+id/gridview" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:verticalSpacing="5dp" 
    android:horizontalSpacing="5dp" 
    android:stretchMode="columnWidth" 
    android:numColumns="2" 
    /> 
</FrameLayout> 

MainActivity.java定製的ImageView保持其長寬比:

public class MainActivity extends ImageView { 
public MainActivity(Context context) { 
    super(context); 
} 

public MainActivity(Context context, AttributeSet attrs) { 
    super(context, attrs); 
} 

public MainActivity(Context context, AttributeSet attrs, int defStyle) { 
    super(context, attrs, defStyle); 
} 

@Override 
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
    super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
    setMeasuredDimension(getMeasuredWidth(), getMeasuredWidth()); //Snap to width 
} 
} 

這是一個網格項目的佈局:

<?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" > 

<com.example.conversa.MainActivity 
    android:id="@+id/picture" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:scaleType="centerCrop" 
    /> 
<TextView 
    android:id="@+id/text" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:paddingLeft="10dp" 
    android:paddingRight="10dp" 
    android:paddingTop="15dp" 
    android:paddingBottom="15dp" 
    android:layout_gravity="bottom" 
    android:textColor="@android:color/white" 
    android:background="#55000000" 
    /> 

</FrameLayout> 

這是gridview的適配器:

public class MyAdapter extends BaseAdapter { 
private List<Item> items = new ArrayList<Item>(); 
private LayoutInflater inflater; 

public MyAdapter(Context context) { 
    inflater = LayoutInflater.from(context); 

    items.add(new Item("Conversation 1",  R.drawable.pic1)); 
    items.add(new Item("Conversation 2", R.drawable.pic2)); 
    items.add(new Item("Conversation 3", R.drawable.pic3)); 
    items.add(new Item("Conversation 4",  R.drawable.pic4)); 
    items.add(new Item("Conversation 5",  R.drawable.pic5)); 
    items.add(new Item("Conversation 6",  R.drawable.pic6)); 
    items.add(new Item("Conversation 7",  R.drawable.pic7)); 
    items.add(new Item("Conversation 8",  R.drawable.pic8)); 
    items.add(new Item("Conversation 9",  R.drawable.pic9)); 
    items.add(new Item("Conversation 10",  R.drawable.pic10)); 
} 

@Override 
public int getCount() { 
    return items.size(); 
} 

@Override 
public Object getItem(int i) { 
    return items.get(i); 
} 

@Override 
public long getItemId(int i) { 
    return items.get(i).drawableId; 
} 

@Override 
public View getView(int i, View view, ViewGroup viewGroup) { 
    View v = view; 
    ImageView picture; 
    TextView name; 

    if(v == null) { 
     v = inflater.inflate(R.layout.gridimage, viewGroup, false); 
     v.setTag(R.id.picture, v.findViewById(R.id.picture)); 
     v.setTag(R.id.text, v.findViewById(R.id.text)); 
    } 

    picture = (ImageView)v.getTag(R.id.picture); 
    name = (TextView)v.getTag(R.id.text); 

    Item item = (Item)getItem(i); 

    picture.setImageResource(item.drawableId); 
    name.setText(item.name); 

    return v; 
} 

private class Item { 
    final String name; 
    final int drawableId; 

    Item(String name, int drawableId) { 
     this.name = name; 
     this.drawableId = drawableId; 
    } 
} 
} 

而這正是適配器設置爲GridView控件:

public class Gridpiw extends Activity { 

@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 
    GridView gridView = (GridView)findViewById(R.id.gridview); 
    gridView.setAdapter(new MyAdapter(this)); 
} 

} 

什麼都要我添加或修改,以便圖像可以點擊顯示新的活動?

回答

1

你應該做的是這樣的:

首先,創建你activity_main.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"> 

    <GridView 
     android:id="@+id/gridview" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:verticalSpacing="5dp" 
     android:horizontalSpacing="5dp" 
     android:stretchMode="columnWidth" 
     android:numColumns="2"/> 

</FrameLayout> 

其次,改變你的GridpiwMainActivity類名:

public class MainActivity extends Activity { 

    @Override 
    public void onCreate(Bundle savedInstanceState) { 
     super.onCreate(savedInstanceState); 
     setContentView(R.layout.activity_main); 
     GridView gridView = (GridView) findViewById(R.id.gridview); 
     gridView.setAdapter(new MyAdapter(this)); 
    } 
} 

第三,改變你的MainActivity擴展的ImageViewMeasuredImageView延伸的ImageView,像這樣:

public class MeasuredImageView extends ImageView { 
    public MeasuredImageView(Context context) { 
     super(context); 
    } 

    public MeasuredImageView(Context context, AttributeSet attrs) { 
     super(context, attrs); 
    } 

    public MeasuredImageView(Context context, AttributeSet attrs, int defStyle) { 
     super(context, attrs, defStyle); 
    } 

    @Override 
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { 
     super.onMeasure(widthMeasureSpec, heightMeasureSpec); 
     setMeasuredDimension(getMeasuredWidth(), getMeasuredWidth()); //Snap to width 
    } 
} 

然後,包括我牛逼到您的電網項目佈局:

<?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" > 

    <com.example.conversa.MeasuredImageView 
     android:id="@+id/picture" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:clickable="true" 
     android:scaleType="centerCrop" 
    /> 
    <TextView 
     android:id="@+id/text" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:paddingLeft="10dp" 
     android:paddingRight="10dp" 
     android:paddingTop="15dp" 
     android:paddingBottom="15dp" 
     android:layout_gravity="bottom" 
     android:textColor="@android:color/white" 
     android:background="#55000000" 
    /> 

</FrameLayout> 

注: ID爲 「圖片」 你的ImageView應該具有屬性的android:點擊= 「真」。

然後在您的適配器中,您應該存儲作爲參數傳遞的上下文。

public class MyAdapter extends BaseAdapter { 
    ... 
    private Context context 
    ... 
    public MyAdapter(Context context) { 
     this.context = context; 
     //your actions... 
    } 
} 

最後,在適配器類的getView()函數,你應該setOnClickListener您的ImageView:

... 
@Override 
public View getView(int i, View view, ViewGroup viewGroup) { 
    View v = view; 
    ImageView picture; 
    TextView name; 

    if(v == null) { 
     v = inflater.inflate(R.layout.gridimage, viewGroup, false); 
     v.setTag(R.id.picture, v.findViewById(R.id.picture)); 
     v.setTag(R.id.text, v.findViewById(R.id.text)); 
    } 

    picture = (ImageView)v.getTag(R.id.picture); 
    name = (TextView)v.getTag(R.id.text); 

    Item item = (Item)getItem(i); 

    picture.setImageResource(item.drawableId); 
    name.setText(item.name); 

    picture.setOnClickListener(new View.OnClickListener() { 
     @Override 
     public void onClick(View v) { 
      Intent intent = new Intent(context, SecondActivity.class); 
      context.startActivity(intent); 
     } 
    }); 

    return v; 
} 
... 

希望這有助於。

+0

感謝您的答案,但我怎麼能讓每個圖像項目有它自己的活動。我希望每個項目都擁有一項活動。例如,圖像3進入ThirdActivity,圖像4進入FourthActivity等等。 – Sororon 2014-10-29 15:51:33

+0

你爲什麼要這麼多活動? – rom4ek 2014-10-29 17:13:29

+0

我正在嘗試製作一個簡單的對話應用程序,它有10個活動要顯示。當您點擊每個項目時,它將轉到指向您點擊的項目的活動。例如,第1項是關於「介紹」對話,所以當您單擊該項時,它會調用名爲「introduction.java」的活動。第2項是關於「尋求幫助」的對話,當你點擊該項時,它會轉到「askhelp.java」活動。其他人也是如此。它怎麼可能在下面的代碼中工作? – Sororon 2014-10-30 01:20:57

0

添加這種代碼爲ImageViews到你的代碼中你轉接器內getView()

添加onClickListener()

picture.setOnClickListener(new OnClickListener() { 
     // Start new list activity 
     public void onClick(View v) { 
      Intent mainIntent = new Inten(SampleMainActivity.this,SecondActivity.class); 
      startActivity(mainIntent); 
     } 
} 
+0

我在我的程序中實現了這個方法,但是我無法使用switch case調用多個活動。你能解釋一下嗎? – Sororon 2014-10-29 16:37:45