如何实现分享按钮点击时Fragment上滑效果？求入门方向与资源建议

Hey there! Let's break down how to implement that slick upward-sliding share Fragment with a screenshot, just like ixigo does. I'll walk you through the basics, key tech topics, code snippets, and handy libraries to make this easier.

Start with this step-by-step workflow to keep things organized:

1. Capture the current view screenshot: Grab the visual content of the screen (or specific view) you want to share.
2. Build a bottom-up panel: Use a BottomSheetDialogFragment (the standard Android component for this kind of sliding panel) as your share container—it comes with built-in slide behavior out of the box.
3. Add custom slide animations: Tweak the default animation to match ixigo's smooth upward slide (with optional fade-in).
4. Integrate share functionality: Connect the panel to Android's share system to send the screenshot to other apps.

These are the core concepts you'll need to wrap your head around:

• BottomSheetDialogFragment: The foundation for your sliding share panel—handles layout, slide gestures, and screen compatibility.
• View Screenshot Capture: Use either View.getDrawingCache() (for capturing a specific view) or MediaProjection API (for full-screen captures, if needed).
• Property Animation: Customize slide/fade effects using Android's animation framework to polish the panel's entry.
• Share Intent & FileProvider: Use Android's system share intent to send the screenshot, and FileProvider to safely share files with other apps.

Let's put this into actionable code snippets (using Kotlin, but you can adapt to Java easily):

1. Capture a View Screenshot #

First, a utility function to grab the bitmap of your target view:

fun captureViewScreenshot(targetView: View): Bitmap? {
    targetView.isDrawingCacheEnabled = true
    // Create a bitmap from the view's drawing cache
    val screenshotBitmap = Bitmap.createBitmap(targetView.drawingCache)
    targetView.isDrawingCacheEnabled = false
    return screenshotBitmap
}

2. Create the Share BottomSheetFragment #

This fragment will hold the screenshot and share options:

Layout File (res/layout/layout_share_bottom_sheet.xml) #

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:padding="16dp"
    android:background="@drawable/bottom_sheet_rounded_bg">

    <ImageView
        android:id="@+id/iv_screenshot"
        android:layout_width="match_parent"
        android:layout_height="220dp"
        android:scaleType="centerCrop"/>

    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Share this screen"
        android:textSize="18sp"
        android:layout_marginVertical="16dp"/>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:gap="12dp">

        <Button
            android:id="@+id/btn_whatsapp"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="WhatsApp"/>

        <Button
            android:id="@+id/btn_facebook"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Facebook"/>
    </LinearLayout>
</LinearLayout>

Fragment Code #

class ShareBottomSheetFragment : BottomSheetDialogFragment() {

    private lateinit var screenshotBitmap: Bitmap

    companion object {
        private const val ARG_SCREENSHOT = "screenshot"

        // Factory method to pass the screenshot to the fragment
        fun newInstance(bitmap: Bitmap): ShareBottomSheetFragment {
            val fragment = ShareBottomSheetFragment()
            val args = Bundle().apply {
                putParcelable(ARG_SCREENSHOT, bitmap)
            }
            fragment.arguments = args
            return fragment
        }
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        // Load the screenshot from arguments
        screenshotBitmap = arguments?.getParcelable(ARG_SCREENSHOT) ?: Bitmap.createBitmap(1,1, Bitmap.Config.ARGB_8888)
        // Set custom theme for the bottom sheet
        setStyle(STYLE_NORMAL, R.style.CustomBottomSheetTheme)
    }

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?): View? {
        return inflater.inflate(R.layout.layout_share_bottom_sheet, container, false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        // Display the screenshot
        view.iv_screenshot.setImageBitmap(screenshotBitmap)

        // Add slide-up animation to the view
        val slideUpAnim = AnimationUtils.loadAnimation(requireContext(), R.anim.slide_up)
        view.startAnimation(slideUpAnim)

        // Handle share button clicks
        view.btn_whatsapp.setOnClickListener { shareToApp("com.whatsapp") }
        view.btn_facebook.setOnClickListener { shareToApp("com.facebook.katana") }
    }

    private fun shareToApp(packageName: String?) {
        // Save bitmap to a temporary file
        val tempFile = File(requireContext().externalCacheDir, "share_screenshot_${System.currentTimeMillis()}.png")
        try {
            FileOutputStream(tempFile).use { outputStream ->
                screenshotBitmap.compress(Bitmap.CompressFormat.PNG, 100, outputStream)
            }
        } catch (e: IOException) {
            e.printStackTrace()
            return
        }

        // Create share intent
        val shareIntent = Intent(Intent.ACTION_SEND).apply {
            type = "image/png"
            val uri = FileProvider.getUriForFile(requireContext(), "${requireContext().packageName}.fileprovider", tempFile)
            putExtra(Intent.EXTRA_STREAM, uri)
            packageName?.let { setPackage(it) } // Target specific app
            addFlags(Intent.FLAG_GRANT_READ_URI_PERMISSION)
        }

        startActivity(Intent.createChooser(shareIntent, "Share via"))
    }
}

3. Configure Dependencies & Resources #

• Add FileProvider to Manifest: To safely share files with other apps:

<provider
    android:name="androidx.core.content.FileProvider"
    android:authorities="${applicationId}.fileprovider"
    android:exported="false"
    android:grantUriPermissions="true">
    <meta-data
        android:name="android.support.FILE_PROVIDER_PATHS"
        android:resource="@xml/file_paths"/>
</provider>

• Create res/xml/file_paths.xml:

<paths xmlns:android="http://schemas.android.com/apk/res/android">
    <external-cache-path name="external_cache" path="."/>
</paths>

• Slide-Up Animation (res/anim/slide_up.xml):

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate
        android:fromYDelta="100%"
        android:toYDelta="0%"
        android:duration="300"/>
    <alpha
        android:fromAlpha="0.0"
        android:toAlpha="1.0"
        android:duration="300"/>
</set>

4. Trigger the Bottom Sheet from Your Activity #

// In your activity's share button click listener
btn_share.setOnClickListener {
    val targetView = findViewById<View>(R.id.main_content) // The view you want to capture
    val screenshot = captureViewScreenshot(targetView)
    screenshot?.let {
        val shareBottomSheet = ShareBottomSheetFragment.newInstance(it)
        shareBottomSheet.show(supportFragmentManager, "ShareBottomSheetTag")
    }
}

• Material Components for Android: The official library that includes BottomSheetDialogFragment—stable, well-documented, and the best starting point.
• Glide: Optional, but useful for optimizing screenshot loading (resizing, caching) to avoid memory issues.
• ShareCompat: Part of AndroidX, simplifies creating share intents with better compatibility across Android versions.

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