Android studioにてボタンを画像表示させる方法

Question

前提

AndroidstudioでExcel出力、画像選択をする際のボタンを画像で表示させたいのですが、それがうまく行きません。良い方法あれば教えて頂けたらと思います。

#試したこと
Buttun属性をImageButtonに書き換えたり、srcをbackground に書き換えたり、ImageViewで表示させようとしたりもしてみたのですが、こちらも他のソースとの関係上変えるのが難しくどうしたらいいか分かりませんでした。

https://github.com/araara3842/TextDetection27.git

該当のソースコード

<?xml version="1.0" encoding="UTF-8"?>

-<RelativeLayout tools:context=".MainActivity" android:layout_height="match_parent" android:layout_width="match_parent" xmlns:tools="http://schemas.android.com/tools" xmlns:android="http://schemas.android.com/apk/res/android">

<!--image view to display our image-->



-<ScrollView android:layout_height="match_parent" android:layout_width="match_parent" android:layout_marginBottom="8dp" android:layout_marginEnd="8dp" android:layout_marginTop="8dp" android:layout_marginStart="8dp" android:layout_above="@+id/linear_holder">

<TextView android:layout_height="wrap_content" android:layout_width="match_parent" android:textSize="22sp" android:textColor="@color/black" android:text="Hello, Capture or Choose an Image to Extract Text." android:layout_below="@+id/image" android:id="@+id/text_data"/>

</ScrollView>


-<LinearLayout android:layout_height="wrap_content" android:layout_width="match_parent" android:id="@+id/linear_holder" android:layout_alignParentBottom="true">

<!--button to capture our image-->


<Button android:layout_height="wrap_content" android:layout_width="0pt" android:id="@+id/button_capture" android:src="@drawable/capture" android:layout_margin="8dp" android:layout_weight="1"/>

<Button android:layout_height="wrap_content" android:layout_width="0pt" android:id="@+id/button_excel" android:src="@drawable/excel2" android:layout_margin="8dp" android:layout_weight="1" android:onClick="onExcelClick"/>

<!--button to detect text from our image-->


<Button android:layout_height="wrap_content" android:layout_width="0dp" android:text="Copy Text" android:id="@+id/button_copy" android:layout_margin="8dp" android:layout_weight="1" android:visibility="gone"/>

</LinearLayout>

</RelativeLayout>

package com.example.textdetection;

import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.app.ActivityCompat;
import androidx.core.content.ContextCompat;

import android.Manifest;
import android.content.ClipData;
import android.content.ClipboardManager;
import android.content.Context;
import android.content.Intent;
import android.content.SharedPreferences;
import android.content.pm.PackageManager;
import android.graphics.Bitmap;
import android.net.Uri;
import android.os.Bundle;
import android.provider.MediaStore;
import android.service.voice.VoiceInteractionSession;
import android.util.SparseArray;
import android.view.View;
import android.widget.Button;
import android.widget.Space;
import android.widget.TextView;
import android.widget.Toast;

import com.google.android.gms.vision.Frame;
import com.google.android.gms.vision.text.TextBlock;
import com.google.android.gms.vision.text.TextRecognizer;
import com.theartofdev.edmodo.cropper.CropImage;
import com.theartofdev.edmodo.cropper.CropImageView;

import java.io.IOException;







import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;
import org.apache.poi.hssf.usermodel.HSSFCellStyle;
import org.apache.poi.hssf.usermodel.HSSFWorkbook;
import org.apache.poi.hssf.util.HSSFColor;
import org.apache.poi.ss.usermodel.Cell;
import org.apache.poi.ss.usermodel.CellStyle;
import org.apache.poi.ss.usermodel.Row;
import org.apache.poi.ss.usermodel.Sheet;
import org.apache.poi.ss.usermodel.Workbook;
import java.io.File;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import java.io.IOException;








public class MainActivity extends AppCompatActivity {
    Button button_capture,button_copy,button_excel;
    TextView textview_data;
    Bitmap bitmap;
    private static final int REQUEST_CAMERA_CODE = 100;
    int count;
    private SharedPreferences preference;
    private SharedPreferences.Editor editor;



    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        button_capture = findViewById(R.id.button_capture);
        button_copy = findViewById(R.id.button_copy);
        button_excel = findViewById(R.id.button_excel);
        textview_data = findViewById(R.id.text_data);


        //プリファレンスの準備
        preference = getSharedPreferences("Preference Name", MODE_PRIVATE);
        editor = preference.edit();

        if (preference.getBoolean("Launched", false)==false) {
            //初回起動時の処理
            count=1;

            //プリファレンスの書き変え
            editor.putBoolean("Launched", true);
            editor.commit();
        }




        if (ContextCompat.checkSelfPermission(MainActivity.this, Manifest.permission.CAMERA) != PackageManager.PERMISSION_GRANTED) {
            ActivityCompat.requestPermissions(MainActivity.this, new String[]{
                    Manifest.permission.CAMERA
            }, REQUEST_CAMERA_CODE);
        }
        button_capture.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                CropImage.activity().setGuidelines(CropImageView.Guidelines.ON).start(MainActivity.this);
            }
        });
        button_copy.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                String scanned_text= textview_data.getText().toString();
                copyToClipBoard(scanned_text);
            }
            });
    }


    @Override
    protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
        super.onActivityResult(requestCode, resultCode, data);
        if (requestCode == CropImage.CROP_IMAGE_ACTIVITY_REQUEST_CODE) {
            CropImage.ActivityResult result = CropImage.getActivityResult(data);
            if (resultCode == RESULT_OK) {
                Uri resultUri = result.getUri();
                try {
                    bitmap = MediaStore.Images.Media.getBitmap(this.getContentResolver(),resultUri);
                    getTextFromImage(bitmap);
                }
                catch (IOException e)

                {
                    e.printStackTrace();
                }
            }
        }
    }














public void onExcelClick(View v) {
    File file;

    String scanned_text= textview_data.getText().toString();

    Workbook wb = new HSSFWorkbook();
    Cell cell = null;
    CellStyle cellStyle = wb.createCellStyle();
   // cellStyle.setFillForegroundColor(HSSFColor.LIGHT_BLUE.index);
    cellStyle.setFillPattern(HSSFCellStyle.SOLID_FOREGROUND);


    //Now we are creating sheet
    Sheet sheet = null;
    sheet = wb.createSheet("Name of sheet");
    //Now column and row

    Row row = sheet.createRow(0);
    cell = row.createCell(0);
    cell.setCellValue(scanned_text);
    cell.setCellStyle(cellStyle);

    sheet.setColumnWidth(0, (10 * 200));

    SharedPreferences data = getSharedPreferences("Data", MODE_PRIVATE);
    SharedPreferences.Editor editor = data.edit();



if(count==1){


    file = new File(getExternalFilesDir(null), "plik1.xls");

        count++;
        editor.putInt("DataInt", count);
        editor.commit();

}else{
  count = data.getInt("DataInt", count);

 
   file = new File(getExternalFilesDir(null), "plik"+count+".xls");
        count++;
   editor.putInt("DataInt", count);
    editor.commit();


}










    FileOutputStream outputStream = null;


    try {
        outputStream = new FileOutputStream(file);
        wb.write(outputStream);
        Toast.makeText(getApplicationContext(), "OK", Toast.LENGTH_LONG).show();
    } catch (java.io.IOException e) {

        e.printStackTrace();

        Toast.makeText(getApplicationContext(), "NO OK", Toast.LENGTH_LONG).show();
        try {
            outputStream.close();
        } catch (IOException ex) {
            ex.printStackTrace();
        }
    }
}





    private void getTextFromImage(Bitmap bitmap)
    {
        TextRecognizer recognizer = new TextRecognizer.Builder(this).build();
        if (!recognizer.isOperational())
        {
            Toast.makeText(MainActivity.this,"Error Occurred!!",Toast.LENGTH_SHORT).show();
        }
        else
        {
            Frame frame = new Frame.Builder().setBitmap(bitmap).build();
            SparseArray<TextBlock> textBlockSparseArray= recognizer.detect(frame);
            StringBuilder stringBuilder = new StringBuilder();
            for (int i=0; i<textBlockSparseArray.size();i++) {
                TextBlock textBlock = textBlockSparseArray.valueAt(i);
                stringBuilder.append(textBlock.getValue());
                stringBuilder.append("\n");
            }
            textview_data.setText(stringBuilder.toString());
            button_capture.setText("Retake");
            button_copy.setVisibility(View.VISIBLE);
        }
    }
    private void copyToClipBoard(String text)
    {
        ClipboardManager clipBoard= (ClipboardManager) getSystemService(Context.CLIPBOARD_SERVICE);
        ClipData clip = ClipData.newPlainText("Copied data",text);
        clipBoard.setPrimaryClip(clip);
        Toast.makeText(MainActivity.this,"Copied to Clipboard!",Toast.LENGTH_SHORT).show();
    }
}

<?xml version="1.0" encoding="UTF-8"?>

-<resources>

<color name="purple_200">#B7B7BBBB</color>

<color name="purple_500">#B7B7BBBB</color>

<color name="purple_700">#B7B7BBBB</color>

<color name="teal_200">#B7B7BBBB</color>

<color name="teal_700">#FF000000</color>

<color name="black">#FF000000</color>

<color name="white">#FFFFFFFF</color>

</resources>

Comments

[jimbe]

＞Android studioにて
AndroidStudio は開発ツールですが、その AndroidStudio にボタンを表示したいのではなく、AndroidStudio を使って作っているアプリの話と思います。

> うまく行きません
どのボタンが、どうしたいのが、どうなるのでしょうか。

> 他のソースとの関係上変えるのが難しく
どのソースとのどのような関係で難しいのでしょう。

[dodox86]

Excelの操作とButtonへの画像表示は本来は別のトピックの気がしますがそんなことは無いのでしょうか。切り離して考えられませんか。

[2r4h8k3m]

ジンベさん
ご質問ありがとうございます、ButtonをImageButtonに変えてしまうと、MainActivityファイルでButtonとして実装していたものを自分の方で変更するのが難しいという意味でそのように書きました。画像選択のボタンの方でsetOnClickListener関数を使っていて、その辺りの変換がよく分からなかったです。日本語が不親切ですみません。

[2r4h8k3m]

dodox86さん
ボタンが2つあるアプリでExcel出力のボタンにはおそらくButton属性での定義は関係ないのですが、画像選択のためのsetOnClickListener関数がImageButtonに変更すると難しいという意味で書きました。言葉足らずですみません。

[dodox86]

画像ファイルは正しく選択できているのですか？　で、選択後にその画像をボタン上に表示させたいということなのでしょうか。

[jimbe]

> Buttonとして実装していたものを自分の方で変更するのが難しい

Button を ImageButton と書き換えるだけですけど…。もちろん setText が出来なくなったりはしますが、最初から「難しい」と言ってしまっては進歩できません。 Button を ImageButton に変えたくらいではスマホが壊れたりはしないのですから、ドキュメントをしっかり読んでどんどんチャレンジしたほうが勉強になると思います。

[2r4h8k3m]

返信大変遅くなってしまいすみません。

dodoxさん
変える中で画像は表示されるがcolorで指定したグレーに塗りつぶされてしまったり、textが表示されなかったりなどしました。こちらのファイルは確かtextが表示されないものだったと思います。

jimbeさん
ベストアンサーもありがとうございました、、アイコン指定も助かりました。あとはMainActivityでbuttonのIDを用いて使っている関数をどう変更するかですね...確かに自分の考察も足りないのですが、ImageButton自体が特殊な属性で変更になるので、ネットでsetOnClickListenerの代わりを見つけるのが難しいと思いました。

Answer 1

とりあえず… xml の Button でアイコンの指定は drawableLeft 等になります。 (src で指定するのは ImageButton です。)
android:drawableLeft="@drawable/capture" とかですね。
変に試行錯誤するのではなくドキュメントを確認してください。