Android Studio实现：点击索引标题跳转至对应图片展示页面

嘿，我来帮你搞定这个Android书籍阅读项目的跳转逻辑！结合你给出的TableLayout布局，咱们一步步实现点击索引标题跳转到对应图片页面的功能：

1. 完善索引页的TableLayout布局 #

你给出的布局开头可以补全成这样（每一行对应一个章节标题+页码，设置可点击属性）：

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:stretchColumns="0,1">

    <!-- 表头 -->
    <TableRow>
        <TextView
            android:text="章节标题"
            android:textStyle="bold"
            android:padding="8dp"
            android:gravity="center"/>
        <TextView
            android:text="页码"
            android:textStyle="bold"
            android:padding="8dp"
            android:gravity="center"/>
    </TableRow>

    <!-- 示例章节行 -->
    <TableRow 
        android:id="@+id/row_chapter_1"
        android:clickable="true"
        android:background="?attr/selectableItemBackground"
        android:paddingVertical="12dp">
        <TextView
            android:text="第一章：Android开发基础"
            android:paddingHorizontal="8dp"/>
        <TextView
            android:text="第1页"
            android:paddingHorizontal="8dp"
            android:gravity="center"/>
    </TableRow>

    <!-- 可添加更多章节行，重复上述结构即可 -->
</TableLayout>

2. 索引Activity的点击跳转逻辑 #

在你的索引Activity（比如IndexActivity）中，给每个章节行绑定点击事件，传递对应图片的资源ID到目标页面：

Kotlin版本 #

import android.content.Intent
import android.os.Bundle
import android.widget.TableRow
import androidx.appcompat.app.AppCompatActivity

class IndexActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_index)

        // 绑定章节行并设置点击事件
        val chapter1Row = findViewById<TableRow>(R.id.row_chapter_1)
        chapter1Row.setOnClickListener {
            val intent = Intent(this, BookPageActivity::class.java)
            // 传递drawable目录下的图片资源ID
            intent.putExtra("PAGE_IMAGE_ID", R.drawable.chapter_1_page)
            startActivity(intent)
        }

        // 其他章节行同理，替换对应的ID和图片资源即可
    }
}

Java版本 #

import android.content.Intent;
import android.os.Bundle;
import android.widget.TableRow;
import androidx.appcompat.app.AppCompatActivity;

public class IndexActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_index);

        TableRow chapter1Row = findViewById(R.id.row_chapter_1);
        chapter1Row.setOnClickListener(v -> {
            Intent intent = new Intent(this, BookPageActivity.class);
            intent.putExtra("PAGE_IMAGE_ID", R.drawable.chapter_1_page);
            startActivity(intent);
        });
    }
}

3. 创建图片展示Activity #

第一步：编写布局文件activity_book_page.xml #

用ImageView承载书籍页面图片，可根据需求调整缩放类型：

<?xml version="1.0" encoding="utf-8"?>
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/iv_book_page"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scaleType="fitCenter" <!-- 可选fitXY、centerCrop等 -->
    android:background="#f5f5f5"/>

第二步：编写Activity逻辑代码 #

接收传递的图片资源ID并加载显示：

Kotlin版本 #

import android.os.Bundle
import android.widget.ImageView
import androidx.appcompat.app.AppCompatActivity

class BookPageActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_book_page)

        val pageImageView = findViewById<ImageView>(R.id.iv_book_page)
        // 获取传递的图片ID，默认值0表示无有效资源
        val imageResId = intent.getIntExtra("PAGE_IMAGE_ID", 0)
        if (imageResId != 0) {
            pageImageView.setImageResource(imageResId)
        }
    }
}

Java版本 #

import android.os.Bundle;
import android.widget.ImageView;
import androidx.appcompat.app.AppCompatActivity;

public class BookPageActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_book_page);

        ImageView pageImageView = findViewById(R.id.iv_book_page);
        int imageResId = getIntent().getIntExtra("PAGE_IMAGE_ID", 0);
        if (imageResId != 0) {
            pageImageView.setImageResource(imageResId);
        }
    }
}

4. 关键注意事项 #

• 确保所有图片都放在res/drawable目录下，资源名称需符合Android规范（仅小写字母、下划线，无空格/特殊字符）
• 记得在AndroidManifest.xml中注册BookPageActivity：

<activity android:name=".BookPageActivity"/>

• 如果章节数量较多，推荐用RecyclerView替代手动添加TableRow，将章节信息（标题、页码、图片ID）封装成数据类，通过Adapter批量渲染，减少重复代码

内容的提问来源于stack exchange，提问作者fahad