我有json数据的图像和文字。
public class MainActivity extends AppCompatActivity implements AppBarLayout.OnOffsetChangedListener {
int mutedColor = R.attr.colorPrimary;
SwipeRefreshLayout mSwipeRefreshLayout;
AppBarLayout appBarLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolBar = (Toolbar) findViewById(R.id.anim_toolbar);
setSupportActionBar(toolBar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
final CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
collapsingToolbarLayout.setTitle("Sudarshan Sunder");
RecyclerView.LayoutManager layoutManager = new LinearLayoutManager(this);
RecyclerView recyclerView = (RecyclerView) findViewById(R.id.scrollableview);
recyclerView.setLayoutManager(layoutManager);
RecyclerViewAdapter recyclerViewAdapter = new RecyclerViewAdapter(getApplicationContext());
recyclerView.setAdapter(recyclerViewAdapter);
Bitmap bmp = BitmapFactory.decodeResource(getResources(), R.drawable.header);
bmp = CircularImageBitmap.getCroppedBitmap(bmp, 200);
FloatingActionButton floatingActionButton = (FloatingActionButton) findViewById(R.id.fab);
floatingActionButton.setImageBitmap(bmp);
mSwipeRefreshLayout = (SwipeRefreshLayout) findViewById(R.id.contentView);
appBarLayout = (AppBarLayout) findViewById(R.id.bar);
mSwipeRefreshLayout.setOnRefreshListener(new SwipeRefreshLayout.OnRefreshListener() {
@Override
public void onRefresh() {
mSwipeRefreshLayout.setRefreshing(false);
}
});
}
@Override
public void onOffsetChanged(AppBarLayout appBarLayout, int i) {
if (i == 0) {
mSwipeRefreshLayout.setEnabled(true);
} else {
mSwipeRefreshLayout.setEnabled(false);
}
}
@Override
protected void onResume() {
super.onResume();
appBarLayout.addOnOffsetChangedListener(this);
}
@Override
protected void onPause() {
super.onPause();
appBarLayout.removeOnOffsetChangedListener(this);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
我使用这种方法将一些json数据分解为图像,一些分解为弹出窗口中的文本。
以图像形式查看:
"imageCollection": {
"Name": "Anna",
"imageUrl":"https://xxx/xxx/img.jpg?t=5657565",
},
以纯文本形式查看
document.getElementById("img").src=
jsonData.imageCollection.logo;
我应该如何将这两种方法合并为一个输出?有什么建议吗?我的popup.html
document.getElementById("host").innerHTML=
jsonData.imageCollection.Name
答案 0 :(得分:0)
你在找这样的东西吗?
<div id="host">
<image id="img"></image>
<div id="nme"></name>
</div>
document.getElementById("img").src = jsonData.imageCollection.logo;
document.getElementById("nme").innerHTML= jsonData.imageCollection.Name
答案 1 :(得分:0)
要显示标题为标题的图像,您需要执行以下操作:
<div class="popup">
<img id="img" />
<span id="host"></span>
</div>
为了清楚起见,这里的JS包含了存储在变量中的元素:
var image = document.getElementById('img');
var host = document.getElementById('host');
image.src = jsonData.imageCollection.logo;
host.innerHTML = jsonData.imageCollection.Name;
在原始HTML中,您设置的是图片来源(好),然后通过设置host.innerHTML
来替换整个<img>
。为了解决这个问题,我将img
标记包装起来并创建了一个新的span
标记,该标记将图像名称保存在另一个div中,以便它们可以一起设置样式。